﻿<!doctype html>
<html class="no-js" lang="en">

<head>
    <meta charset="utf-8">
    <meta http-equiv="x-ua-compatible" content="ie=edge">
    <title>Buttons | Nalika - Material Admin Template</title>
    <meta name="description" content="">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <!-- favicon
		============================================ -->
    <link rel="shortcut icon" type="image/x-icon" href="img/favicon.ico">
    <!-- Google Fonts
		============================================ -->
    <link href="https://fonts.googleapis.com/css?family=Roboto:100,300,400,700,900" rel="stylesheet">
    <!-- Bootstrap CSS
		============================================ -->
    <link rel="stylesheet" href="css/bootstrap.min.css">
    <!-- Bootstrap CSS
		============================================ -->
    <link rel="stylesheet" href="css/font-awesome.min.css">
    <!-- owl.carousel CSS
		============================================ -->
    <link rel="stylesheet" href="css/owl.carousel.css">
    <link rel="stylesheet" href="css/owl.theme.css">
    <link rel="stylesheet" href="css/owl.transitions.css">
    <!-- animate CSS
		============================================ -->
    <link rel="stylesheet" href="css/animate.css">
    <!-- normalize CSS
		============================================ -->
    <link rel="stylesheet" href="css/normalize.css">
    <!-- meanmenu icon CSS
		============================================ -->
    <link rel="stylesheet" href="css/meanmenu.min.css">
    <!-- main CSS
		============================================ -->
    <link rel="stylesheet" href="css/main.css">
    <!-- morrisjs CSS
		============================================ -->
    <link rel="stylesheet" href="css/morrisjs/morris.css">
    <!-- mCustomScrollbar CSS
		============================================ -->
    <link rel="stylesheet" href="css/scrollbar/jquery.mCustomScrollbar.min.css">
    <!-- metisMenu CSS
		============================================ -->
    <link rel="stylesheet" href="css/metisMenu/metisMenu.min.css">
    <link rel="stylesheet" href="css/metisMenu/metisMenu-vertical.css">
    <!-- calendar CSS
		============================================ -->
    <link rel="stylesheet" href="css/calendar/fullcalendar.min.css">
    <link rel="stylesheet" href="css/calendar/fullcalendar.print.min.css">
    <!-- buttons CSS
		============================================ -->
    <link rel="stylesheet" href="css/buttons.css">
    <!-- style CSS
		============================================ -->
    <link rel="stylesheet" href="style.css">
    <!-- responsive CSS
		============================================ -->
    <link rel="stylesheet" href="css/responsive.css">
    <!-- modernizr JS
		============================================ -->
    <script src="js/vendor/modernizr-2.8.3.min.js"></script>
</head>

<body>
    <!--[if lt IE 8]>
            <p class="browserupgrade">You are using an <strong>outdated</strong> browser. Please <a href="http://browsehappy.com/">upgrade your browser</a> to improve your experience.</p>
        <![endif]-->

    <div class="left-sidebar-pro">
        <nav id="sidebar" class="">
            <div class="sidebar-header">
                <a href="index.html"><img class="main-logo" src="img/logo/logo.png" alt="" /></a>
                <strong><img src="img/logo/logosn.png" alt="" /></strong>
            </div>
            <div class="left-custom-menu-adp-wrap comment-scrollbar">
                <nav class="sidebar-nav left-sidebar-menu-pro">
                    <ul class="metismenu" id="menu1">
                        <li>
                            <a class="has-arrow" href="index.html">
								   <i class="fa big-icon fa-home icon-wrap"></i>
								   <span class="mini-click-non">Ecommerce</span>
								</a>
                            <ul class="submenu-angle" aria-expanded="true">
                                <li><a title="Dashboard v.1" href="index.html"><span class="mini-sub-pro">Dashboard v.1</span></a></li>
                                <li><a title="Dashboard v.2" href="index-1.html"><span class="mini-sub-pro">Dashboard v.2</span></a></li>
                                <li><a title="Dashboard v.3" href="index-2.html"><span class="mini-sub-pro">Dashboard v.3</span></a></li>
                                <li><a title="Product List" href="product-list.html"><span class="mini-sub-pro">Product List</span></a></li>
                                <li><a title="Product Edit" href="product-edit.html"><span class="mini-sub-pro">Product Edit</span></a></li>
                                <li><a title="Product Detail" href="product-detail.html"><span class="mini-sub-pro">Product Detail</span></a></li>
                                <li><a title="Product Cart" href="product-cart.html"><span class="mini-sub-pro">Product Cart</span></a></li>
                                <li><a title="Product Payment" href="product-payment.html"><span class="mini-sub-pro">Product Payment</span></a></li>
                                <li><a title="Analytics" href="analytics.html"><span class="mini-sub-pro">Analytics</span></a></li>
                                <li><a title="Widgets" href="widgets.html"><span class="mini-sub-pro">Widgets</span></a></li>
                            </ul>
                        </li>
                        <li>
                            <a class="has-arrow" href="mailbox.html" aria-expanded="false"><i class="fa big-icon fa-envelope icon-wrap"></i> <span class="mini-click-non">Mailbox</span></a>
                            <ul class="submenu-angle" aria-expanded="false">
                                <li><a title="Inbox" href="mailbox.html"><span class="mini-sub-pro">Inbox</span></a></li>
                                <li><a title="View Mail" href="mailbox-view.html"><span class="mini-sub-pro">View Mail</span></a></li>
                                <li><a title="Compose Mail" href="mailbox-compose.html"><span class="mini-sub-pro">Compose Mail</span></a></li>
                            </ul>
                        </li>
                        <li>
                            <a class="has-arrow" href="mailbox.html" aria-expanded="false"><i class="fa big-icon fa-flask icon-wrap"></i> <span class="mini-click-non">Interface</span></a>
                            <ul class="submenu-angle" aria-expanded="false">
                                <li><a title="Google Map" href="google-map.html"><span class="mini-sub-pro">Google Map</span></a></li>
                                <li><a title="Data Maps" href="data-maps.html"><span class="mini-sub-pro">Data Maps</span></a></li>
                                <li><a title="Pdf Viewer" href="pdf-viewer.html"><span class="mini-sub-pro">Pdf Viewer</span></a></li>
                                <li><a title="X-Editable" href="x-editable.html"><span class="mini-sub-pro">X-Editable</span></a></li>
                                <li><a title="Code Editor" href="code-editor.html"><span class="mini-sub-pro">Code Editor</span></a></li>
                                <li><a title="Tree View" href="tree-view.html"><span class="mini-sub-pro">Tree View</span></a></li>
                                <li><a title="Preloader" href="preloader.html"><span class="mini-sub-pro">Preloader</span></a></li>
                                <li><a title="Images Cropper" href="images-cropper.html"><span class="mini-sub-pro">Images Cropper</span></a></li>
                            </ul>
                        </li>
                        <li>
                            <a class="has-arrow" href="mailbox.html" aria-expanded="false"><i class="fa big-icon fa-pie-chart icon-wrap"></i> <span class="mini-click-non">Miscellaneous</span></a>
                            <ul class="submenu-angle" aria-expanded="false">
                                <li><a title="File Manager" href="file-manager.html"><span class="mini-sub-pro">File Manager</span></a></li>
                                <li><a title="Blog" href="blog.html"><span class="mini-sub-pro">Blog</span></a></li>
                                <li><a title="Blog Details" href="blog-details.html"><span class="mini-sub-pro">Blog Details</span></a></li>
                                <li><a title="404 Page" href="404.html"><span class="mini-sub-pro">404 Page</span></a></li>
                                <li><a title="500 Page" href="500.html"><span class="mini-sub-pro">500 Page</span></a></li>
                            </ul>
                        </li>
                        <li>
                            <a class="has-arrow" href="mailbox.html" aria-expanded="false"><i class="fa big-icon fa-bar-chart-o icon-wrap"></i> <span class="mini-click-non">Charts</span></a>
                            <ul class="submenu-angle" aria-expanded="false">
                                <li><a title="Bar Charts" href="bar-charts.html"><span class="mini-sub-pro">Bar Charts</span></a></li>
                                <li><a title="Line Charts" href="line-charts.html"><span class="mini-sub-pro">Line Charts</span></a></li>
                                <li><a title="Area Charts" href="area-charts.html"><span class="mini-sub-pro">Area Charts</span></a></li>
                                <li><a title="Rounded Charts" href="rounded-chart.html"><span class="mini-sub-pro">Rounded Charts</span></a></li>
                                <li><a title="C3 Charts" href="c3.html"><span class="mini-sub-pro">C3 Charts</span></a></li>
                                <li><a title="Sparkline Charts" href="sparkline.html"><span class="mini-sub-pro">Sparkline Charts</span></a></li>
                                <li><a title="Peity Charts" href="peity.html"><span class="mini-sub-pro">Peity Charts</span></a></li>
                            </ul>
                        </li>
                        <li>
                            <a class="has-arrow" href="mailbox.html" aria-expanded="false"><i class="fa big-icon fa-table icon-wrap"></i> <span class="mini-click-non">Data Tables</span></a>
                            <ul class="submenu-angle" aria-expanded="false">
                                <li><a title="Peity Charts" href="static-table.html"><span class="mini-sub-pro">Static Table</span></a></li>
                                <li><a title="Data Table" href="data-table.html"><span class="mini-sub-pro">Data Table</span></a></li>
                            </ul>
                        </li>
                        <li>
                            <a class="has-arrow" href="mailbox.html" aria-expanded="false"><i class="fa big-icon fa-table icon-wrap"></i> <span class="mini-click-non">Forms Elements</span></a>
                            <ul class="submenu-angle" aria-expanded="false">
                                <li><a title="Basic Form Elements" href="basic-form-element.html"><span class="mini-sub-pro">Bc Form Elements</span></a></li>
                                <li><a title="Advance Form Elements" href="advance-form-element.html"><span class="mini-sub-pro">Ad Form Elements</span></a></li>
                                <li><a title="Password Meter" href="password-meter.html"><span class="mini-sub-pro">Password Meter</span></a></li>
                                <li><a title="Multi Upload" href="multi-upload.html"><span class="mini-sub-pro">Multi Upload</span></a></li>
                                <li><a title="Text Editor" href="tinymc.html"><span class="mini-sub-pro">Text Editor</span></a></li>
                                <li><a title="Dual List Box" href="dual-list-box.html"><span class="mini-sub-pro">Dual List Box</span></a></li>
                            </ul>
                        </li>
                        <li class="active">
                            <a class="has-arrow" href="mailbox.html" aria-expanded="false"><i class="fa big-icon fa-desktop icon-wrap"></i> <span class="mini-click-non">App views</span></a>
                            <ul class="submenu-angle" aria-expanded="false">
                                <li><a title="Notifications" href="notifications.html"><span class="mini-sub-pro">Notifications</span></a></li>
                                <li><a title="Alerts" href="alerts.html"><span class="mini-sub-pro">Alerts</span></a></li>
                                <li><a title="Modals" href="modals.html"><span class="mini-sub-pro">Modals</span></a></li>
                                <li><a title="Buttons" href="buttons.html"><span class="mini-sub-pro">Buttons</span></a></li>
                                <li><a title="Tabs" href="tabs.html"><span class="mini-sub-pro">Tabs</span></a></li>
                                <li><a title="Accordion" href="accordion.html"><span class="mini-sub-pro">Accordion</span></a></li>
                            </ul>
                        </li>
                        <li id="removable">
                            <a class="has-arrow" href="#" aria-expanded="false"><i class="fa big-icon fa-files-o icon-wrap"></i> <span class="mini-click-non">Pages</span></a>
                            <ul class="submenu-angle" aria-expanded="false">
                                <li><a title="Login" href="login.html"><span class="mini-sub-pro">Login</span></a></li>
                                <li><a title="Register" href="register.html"><span class="mini-sub-pro">Register</span></a></li>
                                <li><a title="Lock" href="lock.html"><span class="mini-sub-pro">Lock</span></a></li>
                                <li><a title="Password Recovery" href="password-recovery.html"><span class="mini-sub-pro">Password Recovery</span></a></li>
                            </ul>
                        </li>
                    </ul>
                </nav>
            </div>
        </nav>
    </div>
    <!-- Start Welcome area -->
    <div class="all-content-wrapper">
        <div class="container-fluid">
            <div class="row">
                <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
                    <div class="logo-pro">
                        <a href="index.html"><img class="main-logo" src="img/logo/logo.png" alt="" /></a>
                    </div>
                </div>
            </div>
        </div>
        <div class="header-advance-area">
            <div class="header-top-area">
                <div class="container-fluid">
                    <div class="row">
                        <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
                            <div class="header-top-wraper">
                                <div class="row">
                                    <div class="col-lg-1 col-md-0 col-sm-1 col-xs-12">
                                        <div class="menu-switcher-pro">
                                            <button type="button" id="sidebarCollapse" class="btn bar-button-pro header-drl-controller-btn btn-info navbar-btn">
													<i class="fa fa-bars"></i>
												</button>
                                        </div>
                                    </div>
                                    <div class="col-lg-6 col-md-7 col-sm-6 col-xs-12">
                                        <div class="header-top-menu tabl-d-n">
                                            <ul class="nav navbar-nav mai-top-nav">
                                                <li class="nav-item"><a href="#" class="nav-link">Home</a>
                                                </li>
                                                <li class="nav-item"><a href="#" class="nav-link">About</a>
                                                </li>
                                                <li class="nav-item"><a href="#" class="nav-link">Services</a>
                                                </li>
                                                <li class="nav-item"><a href="#" class="nav-link">Support</a>
                                                </li>
                                            </ul>
                                        </div>
                                    </div>
                                    <div class="col-lg-5 col-md-5 col-sm-12 col-xs-12">
                                        <div class="header-right-info">
                                            <ul class="nav navbar-nav mai-top-nav header-right-menu">
                                                <li class="nav-item dropdown">
                                                    <a href="#" data-toggle="dropdown" role="button" aria-expanded="false" class="nav-link dropdown-toggle"><i class="fa fa-envelope-o adminpro-chat-pro" aria-hidden="true"></i><span class="indicator-ms"></span></a>
                                                    <div role="menu" class="author-message-top dropdown-menu animated zoomIn">
                                                        <div class="message-single-top">
                                                            <h1>Message</h1>
                                                        </div>
                                                        <ul class="message-menu">
                                                            <li>
                                                                <a href="#">
                                                                    <div class="message-img">
                                                                        <img src="img/contact/1.jpg" alt="">
                                                                    </div>
                                                                    <div class="message-content">
                                                                        <span class="message-date">16 Sept</span>
                                                                        <h2>Advanda Cro</h2>
                                                                        <p>Please done this project as soon possible.</p>
                                                                    </div>
                                                                </a>
                                                            </li>
                                                            <li>
                                                                <a href="#">
                                                                    <div class="message-img">
                                                                        <img src="img/contact/4.jpg" alt="">
                                                                    </div>
                                                                    <div class="message-content">
                                                                        <span class="message-date">16 Sept</span>
                                                                        <h2>Sulaiman din</h2>
                                                                        <p>Please done this project as soon possible.</p>
                                                                    </div>
                                                                </a>
                                                            </li>
                                                            <li>
                                                                <a href="#">
                                                                    <div class="message-img">
                                                                        <img src="img/contact/3.jpg" alt="">
                                                                    </div>
                                                                    <div class="message-content">
                                                                        <span class="message-date">16 Sept</span>
                                                                        <h2>Victor Jara</h2>
                                                                        <p>Please done this project as soon possible.</p>
                                                                    </div>
                                                                </a>
                                                            </li>
                                                            <li>
                                                                <a href="#">
                                                                    <div class="message-img">
                                                                        <img src="img/contact/2.jpg" alt="">
                                                                    </div>
                                                                    <div class="message-content">
                                                                        <span class="message-date">16 Sept</span>
                                                                        <h2>Victor Jara</h2>
                                                                        <p>Please done this project as soon possible.</p>
                                                                    </div>
                                                                </a>
                                                            </li>
                                                        </ul>
                                                        <div class="message-view">
                                                            <a href="#">View All Messages</a>
                                                        </div>
                                                    </div>
                                                </li>
                                                <li class="nav-item"><a href="#" data-toggle="dropdown" role="button" aria-expanded="false" class="nav-link dropdown-toggle"><i class="fa fa-bell-o" aria-hidden="true"></i><span class="indicator-nt"></span></a>
                                                    <div role="menu" class="notification-author dropdown-menu animated zoomIn">
                                                        <div class="notification-single-top">
                                                            <h1>Notifications</h1>
                                                        </div>
                                                        <ul class="notification-menu">
                                                            <li>
                                                                <a href="#">
                                                                    <div class="notification-icon">
                                                                        <i class="fa fa-check adminpro-checked-pro admin-check-pro" aria-hidden="true"></i>
                                                                    </div>
                                                                    <div class="notification-content">
                                                                        <span class="notification-date">16 Sept</span>
                                                                        <h2>Advanda Cro</h2>
                                                                        <p>Please done this project as soon possible.</p>
                                                                    </div>
                                                                </a>
                                                            </li>
                                                            <li>
                                                                <a href="#">
                                                                    <div class="notification-icon">
                                                                        <i class="fa fa-cloud adminpro-cloud-computing-down" aria-hidden="true"></i>
                                                                    </div>
                                                                    <div class="notification-content">
                                                                        <span class="notification-date">16 Sept</span>
                                                                        <h2>Sulaiman din</h2>
                                                                        <p>Please done this project as soon possible.</p>
                                                                    </div>
                                                                </a>
                                                            </li>
                                                            <li>
                                                                <a href="#">
                                                                    <div class="notification-icon">
                                                                        <i class="fa fa-eraser adminpro-shield" aria-hidden="true"></i>
                                                                    </div>
                                                                    <div class="notification-content">
                                                                        <span class="notification-date">16 Sept</span>
                                                                        <h2>Victor Jara</h2>
                                                                        <p>Please done this project as soon possible.</p>
                                                                    </div>
                                                                </a>
                                                            </li>
                                                            <li>
                                                                <a href="#">
                                                                    <div class="notification-icon">
                                                                        <i class="fa fa-line-chart adminpro-analytics-arrow" aria-hidden="true"></i>
                                                                    </div>
                                                                    <div class="notification-content">
                                                                        <span class="notification-date">16 Sept</span>
                                                                        <h2>Victor Jara</h2>
                                                                        <p>Please done this project as soon possible.</p>
                                                                    </div>
                                                                </a>
                                                            </li>
                                                        </ul>
                                                        <div class="notification-view">
                                                            <a href="#">View All Notification</a>
                                                        </div>
                                                    </div>
                                                </li>
                                                <li class="nav-item">
                                                    <a href="#" data-toggle="dropdown" role="button" aria-expanded="false" class="nav-link dropdown-toggle">
															<i class="fa fa-user adminpro-user-rounded header-riht-inf" aria-hidden="true"></i>
															<span class="admin-name">Advanda Cro</span>
															<i class="fa fa-angle-down adminpro-icon adminpro-down-arrow"></i>
														</a>
                                                    <ul role="menu" class="dropdown-header-top author-log dropdown-menu animated zoomIn">
                                                        <li><a href="register.html"><span class="fa fa-home author-log-ic"></span>Register</a>
                                                        </li>
                                                        <li><a href="#"><span class="fa fa-user author-log-ic"></span>My Profile</a>
                                                        </li>
                                                        <li><a href="lock.html"><span class="fa fa-diamond author-log-ic"></span> Lock</a>
                                                        </li>
                                                        <li><a href="#"><span class="fa fa-cog author-log-ic"></span>Settings</a>
                                                        </li>
                                                        <li><a href="login.html"><span class="fa fa-lock author-log-ic"></span>Log Out</a>
                                                        </li>
                                                    </ul>
                                                </li>
                                                <li class="nav-item nav-setting-open"><a href="#" data-toggle="dropdown" role="button" aria-expanded="false" class="nav-link dropdown-toggle"><i class="fa fa-tasks"></i></a>

                                                    <div role="menu" class="admintab-wrap menu-setting-wrap menu-setting-wrap-bg dropdown-menu animated zoomIn">
                                                        <ul class="nav nav-tabs custon-set-tab">
                                                            <li class="active"><a data-toggle="tab" href="#Notes">News</a>
                                                            </li>
                                                            <li><a data-toggle="tab" href="#Projects">Activity</a>
                                                            </li>
                                                            <li><a data-toggle="tab" href="#Settings">Settings</a>
                                                            </li>
                                                        </ul>

                                                        <div class="tab-content custom-bdr-nt">
                                                            <div id="Notes" class="tab-pane fade in active">
                                                                <div class="notes-area-wrap">
                                                                    <div class="note-heading-indicate">
                                                                        <h2><i class="fa fa-comments-o"></i> Latest News</h2>
                                                                        <p>You have 10 New News.</p>
                                                                    </div>
                                                                    <div class="notes-list-area notes-menu-scrollbar">
                                                                        <ul class="notes-menu-list">
                                                                            <li>
                                                                                <a href="#">
                                                                                    <div class="notes-list-flow">
                                                                                        <div class="notes-img">
                                                                                            <img src="img/contact/4.jpg" alt="" />
                                                                                        </div>
                                                                                        <div class="notes-content">
                                                                                            <p> The point of using Lorem Ipsum is that it has a more-or-less normal.</p>
                                                                                            <span>Yesterday 2:45 pm</span>
                                                                                        </div>
                                                                                    </div>
                                                                                </a>
                                                                            </li>
                                                                            <li>
                                                                                <a href="#">
                                                                                    <div class="notes-list-flow">
                                                                                        <div class="notes-img">
                                                                                            <img src="img/contact/1.jpg" alt="" />
                                                                                        </div>
                                                                                        <div class="notes-content">
                                                                                            <p> The point of using Lorem Ipsum is that it has a more-or-less normal.</p>
                                                                                            <span>Yesterday 2:45 pm</span>
                                                                                        </div>
                                                                                    </div>
                                                                                </a>
                                                                            </li>
                                                                            <li>
                                                                                <a href="#">
                                                                                    <div class="notes-list-flow">
                                                                                        <div class="notes-img">
                                                                                            <img src="img/contact/2.jpg" alt="" />
                                                                                        </div>
                                                                                        <div class="notes-content">
                                                                                            <p> The point of using Lorem Ipsum is that it has a more-or-less normal.</p>
                                                                                            <span>Yesterday 2:45 pm</span>
                                                                                        </div>
                                                                                    </div>
                                                                                </a>
                                                                            </li>
                                                                            <li>
                                                                                <a href="#">
                                                                                    <div class="notes-list-flow">
                                                                                        <div class="notes-img">
                                                                                            <img src="img/contact/3.jpg" alt="" />
                                                                                        </div>
                                                                                        <div class="notes-content">
                                                                                            <p> The point of using Lorem Ipsum is that it has a more-or-less normal.</p>
                                                                                            <span>Yesterday 2:45 pm</span>
                                                                                        </div>
                                                                                    </div>
                                                                                </a>
                                                                            </li>
                                                                            <li>
                                                                                <a href="#">
                                                                                    <div class="notes-list-flow">
                                                                                        <div class="notes-img">
                                                                                            <img src="img/contact/4.jpg" alt="" />
                                                                                        </div>
                                                                                        <div class="notes-content">
                                                                                            <p> The point of using Lorem Ipsum is that it has a more-or-less normal.</p>
                                                                                            <span>Yesterday 2:45 pm</span>
                                                                                        </div>
                                                                                    </div>
                                                                                </a>
                                                                            </li>
                                                                            <li>
                                                                                <a href="#">
                                                                                    <div class="notes-list-flow">
                                                                                        <div class="notes-img">
                                                                                            <img src="img/contact/1.jpg" alt="" />
                                                                                        </div>
                                                                                        <div class="notes-content">
                                                                                            <p> The point of using Lorem Ipsum is that it has a more-or-less normal.</p>
                                                                                            <span>Yesterday 2:45 pm</span>
                                                                                        </div>
                                                                                    </div>
                                                                                </a>
                                                                            </li>
                                                                            <li>
                                                                                <a href="#">
                                                                                    <div class="notes-list-flow">
                                                                                        <div class="notes-img">
                                                                                            <img src="img/contact/2.jpg" alt="" />
                                                                                        </div>
                                                                                        <div class="notes-content">
                                                                                            <p> The point of using Lorem Ipsum is that it has a more-or-less normal.</p>
                                                                                            <span>Yesterday 2:45 pm</span>
                                                                                        </div>
                                                                                    </div>
                                                                                </a>
                                                                            </li>
                                                                            <li>
                                                                                <a href="#">
                                                                                    <div class="notes-list-flow">
                                                                                        <div class="notes-img">
                                                                                            <img src="img/contact/1.jpg" alt="" />
                                                                                        </div>
                                                                                        <div class="notes-content">
                                                                                            <p> The point of using Lorem Ipsum is that it has a more-or-less normal.</p>
                                                                                            <span>Yesterday 2:45 pm</span>
                                                                                        </div>
                                                                                    </div>
                                                                                </a>
                                                                            </li>
                                                                            <li>
                                                                                <a href="#">
                                                                                    <div class="notes-list-flow">
                                                                                        <div class="notes-img">
                                                                                            <img src="img/contact/2.jpg" alt="" />
                                                                                        </div>
                                                                                        <div class="notes-content">
                                                                                            <p> The point of using Lorem Ipsum is that it has a more-or-less normal.</p>
                                                                                            <span>Yesterday 2:45 pm</span>
                                                                                        </div>
                                                                                    </div>
                                                                                </a>
                                                                            </li>
                                                                            <li>
                                                                                <a href="#">
                                                                                    <div class="notes-list-flow">
                                                                                        <div class="notes-img">
                                                                                            <img src="img/contact/3.jpg" alt="" />
                                                                                        </div>
                                                                                        <div class="notes-content">
                                                                                            <p> The point of using Lorem Ipsum is that it has a more-or-less normal.</p>
                                                                                            <span>Yesterday 2:45 pm</span>
                                                                                        </div>
                                                                                    </div>
                                                                                </a>
                                                                            </li>
                                                                        </ul>
                                                                    </div>
                                                                </div>
                                                            </div>
                                                            <div id="Projects" class="tab-pane fade">
                                                                <div class="projects-settings-wrap">
                                                                    <div class="note-heading-indicate">
                                                                        <h2><i class="fa fa-cube"></i> Recent Activity</h2>
                                                                        <p> You have 20 Recent Activity.</p>
                                                                    </div>
                                                                    <div class="project-st-list-area project-st-menu-scrollbar">
                                                                        <ul class="projects-st-menu-list">
                                                                            <li>
                                                                                <a href="#">
                                                                                    <div class="project-list-flow">
                                                                                        <div class="projects-st-heading">
                                                                                            <h2>New User Registered</h2>
                                                                                            <p> The point of using Lorem Ipsum is that it has a more or less normal.</p>
                                                                                            <span class="project-st-time">1 hours ago</span>
                                                                                        </div>
                                                                                    </div>
                                                                                </a>
                                                                            </li>
                                                                            <li>
                                                                                <a href="#">
                                                                                    <div class="project-list-flow">
                                                                                        <div class="projects-st-heading">
                                                                                            <h2>New Order Received</h2>
                                                                                            <p> The point of using Lorem Ipsum is that it has a more or less normal.</p>
                                                                                            <span class="project-st-time">2 hours ago</span>
                                                                                        </div>
                                                                                    </div>
                                                                                </a>
                                                                            </li>
                                                                            <li>
                                                                                <a href="#">
                                                                                    <div class="project-list-flow">
                                                                                        <div class="projects-st-heading">
                                                                                            <h2>New Order Received</h2>
                                                                                            <p> The point of using Lorem Ipsum is that it has a more or less normal.</p>
                                                                                            <span class="project-st-time">3 hours ago</span>
                                                                                        </div>
                                                                                    </div>
                                                                                </a>
                                                                            </li>
                                                                            <li>
                                                                                <a href="#">
                                                                                    <div class="project-list-flow">
                                                                                        <div class="projects-st-heading">
                                                                                            <h2>New Order Received</h2>
                                                                                            <p> The point of using Lorem Ipsum is that it has a more or less normal.</p>
                                                                                            <span class="project-st-time">4 hours ago</span>
                                                                                        </div>
                                                                                    </div>
                                                                                </a>
                                                                            </li>
                                                                            <li>
                                                                                <a href="#">
                                                                                    <div class="project-list-flow">
                                                                                        <div class="projects-st-heading">
                                                                                            <h2>New User Registered</h2>
                                                                                            <p> The point of using Lorem Ipsum is that it has a more or less normal.</p>
                                                                                            <span class="project-st-time">5 hours ago</span>
                                                                                        </div>
                                                                                    </div>
                                                                                </a>
                                                                            </li>
                                                                            <li>
                                                                                <a href="#">
                                                                                    <div class="project-list-flow">
                                                                                        <div class="projects-st-heading">
                                                                                            <h2>New Order</h2>
                                                                                            <p> The point of using Lorem Ipsum is that it has a more or less normal.</p>
                                                                                            <span class="project-st-time">6 hours ago</span>
                                                                                        </div>
                                                                                    </div>
                                                                                </a>
                                                                            </li>
                                                                            <li>
                                                                                <a href="#">
                                                                                    <div class="project-list-flow">
                                                                                        <div class="projects-st-heading">
                                                                                            <h2>New User</h2>
                                                                                            <p> The point of using Lorem Ipsum is that it has a more or less normal.</p>
                                                                                            <span class="project-st-time">7 hours ago</span>
                                                                                        </div>
                                                                                    </div>
                                                                                </a>
                                                                            </li>
                                                                            <li>
                                                                                <a href="#">
                                                                                    <div class="project-list-flow">
                                                                                        <div class="projects-st-heading">
                                                                                            <h2>New Order</h2>
                                                                                            <p> The point of using Lorem Ipsum is that it has a more or less normal.</p>
                                                                                            <span class="project-st-time">9 hours ago</span>
                                                                                        </div>
                                                                                    </div>
                                                                                </a>
                                                                            </li>
                                                                        </ul>
                                                                    </div>
                                                                </div>
                                                            </div>
                                                            <div id="Settings" class="tab-pane fade">
                                                                <div class="setting-panel-area">
                                                                    <div class="note-heading-indicate">
                                                                        <h2><i class="fa fa-gears"></i> Settings Panel</h2>
                                                                        <p> You have 20 Settings. 5 not completed.</p>
                                                                    </div>
                                                                    <ul class="setting-panel-list">
                                                                        <li>
                                                                            <div class="checkbox-setting-pro">
                                                                                <div class="checkbox-title-pro">
                                                                                    <h2>Show notifications</h2>
                                                                                    <div class="ts-custom-check">
                                                                                        <div class="onoffswitch">
                                                                                            <input type="checkbox" name="collapsemenu" class="onoffswitch-checkbox" id="example">
                                                                                            <label class="onoffswitch-label" for="example">
																									<span class="onoffswitch-inner"></span>
																									<span class="onoffswitch-switch"></span>
																								</label>
                                                                                        </div>
                                                                                    </div>
                                                                                </div>
                                                                            </div>
                                                                        </li>
                                                                        <li>
                                                                            <div class="checkbox-setting-pro">
                                                                                <div class="checkbox-title-pro">
                                                                                    <h2>Disable Chat</h2>
                                                                                    <div class="ts-custom-check">
                                                                                        <div class="onoffswitch">
                                                                                            <input type="checkbox" name="collapsemenu" class="onoffswitch-checkbox" id="example3">
                                                                                            <label class="onoffswitch-label" for="example3">
																									<span class="onoffswitch-inner"></span>
																									<span class="onoffswitch-switch"></span>
																								</label>
                                                                                        </div>
                                                                                    </div>
                                                                                </div>
                                                                            </div>
                                                                        </li>
                                                                        <li>
                                                                            <div class="checkbox-setting-pro">
                                                                                <div class="checkbox-title-pro">
                                                                                    <h2>Enable history</h2>
                                                                                    <div class="ts-custom-check">
                                                                                        <div class="onoffswitch">
                                                                                            <input type="checkbox" name="collapsemenu" class="onoffswitch-checkbox" id="example4">
                                                                                            <label class="onoffswitch-label" for="example4">
																									<span class="onoffswitch-inner"></span>
																									<span class="onoffswitch-switch"></span>
																								</label>
                                                                                        </div>
                                                                                    </div>
                                                                                </div>
                                                                            </div>
                                                                        </li>
                                                                        <li>
                                                                            <div class="checkbox-setting-pro">
                                                                                <div class="checkbox-title-pro">
                                                                                    <h2>Show charts</h2>
                                                                                    <div class="ts-custom-check">
                                                                                        <div class="onoffswitch">
                                                                                            <input type="checkbox" name="collapsemenu" class="onoffswitch-checkbox" id="example7">
                                                                                            <label class="onoffswitch-label" for="example7">
																									<span class="onoffswitch-inner"></span>
																									<span class="onoffswitch-switch"></span>
																								</label>
                                                                                        </div>
                                                                                    </div>
                                                                                </div>
                                                                            </div>
                                                                        </li>
                                                                        <li>
                                                                            <div class="checkbox-setting-pro">
                                                                                <div class="checkbox-title-pro">
                                                                                    <h2>Update everyday</h2>
                                                                                    <div class="ts-custom-check">
                                                                                        <div class="onoffswitch">
                                                                                            <input type="checkbox" name="collapsemenu" checked="" class="onoffswitch-checkbox" id="example2">
                                                                                            <label class="onoffswitch-label" for="example2">
																									<span class="onoffswitch-inner"></span>
																									<span class="onoffswitch-switch"></span>
																								</label>
                                                                                        </div>
                                                                                    </div>
                                                                                </div>
                                                                            </div>
                                                                        </li>
                                                                        <li>
                                                                            <div class="checkbox-setting-pro">
                                                                                <div class="checkbox-title-pro">
                                                                                    <h2>Global search</h2>
                                                                                    <div class="ts-custom-check">
                                                                                        <div class="onoffswitch">
                                                                                            <input type="checkbox" name="collapsemenu" checked="" class="onoffswitch-checkbox" id="example6">
                                                                                            <label class="onoffswitch-label" for="example6">
																									<span class="onoffswitch-inner"></span>
																									<span class="onoffswitch-switch"></span>
																								</label>
                                                                                        </div>
                                                                                    </div>
                                                                                </div>
                                                                            </div>
                                                                        </li>
                                                                        <li>
                                                                            <div class="checkbox-setting-pro">
                                                                                <div class="checkbox-title-pro">
                                                                                    <h2>Offline users</h2>
                                                                                    <div class="ts-custom-check">
                                                                                        <div class="onoffswitch">
                                                                                            <input type="checkbox" name="collapsemenu" checked="" class="onoffswitch-checkbox" id="example5">
                                                                                            <label class="onoffswitch-label" for="example5">
																									<span class="onoffswitch-inner"></span>
																									<span class="onoffswitch-switch"></span>
																								</label>
                                                                                        </div>
                                                                                    </div>
                                                                                </div>
                                                                            </div>
                                                                        </li>
                                                                    </ul>

                                                                </div>
                                                            </div>
                                                        </div>
                                                    </div>
                                                </li>
                                            </ul>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <!-- Mobile Menu start -->
            <div class="mobile-menu-area">
                <div class="container">
                    <div class="row">
                        <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
                            <div class="mobile-menu">
                                <nav id="dropdown">
                                    <ul class="mobile-menu-nav">
                                        <li><a data-toggle="collapse" data-target="#Charts" href="#">Home <span class="admin-project-icon adminpro-icon adminpro-down-arrow"></span></a>
                                            <ul class="collapse dropdown-header-top">
                                                <li><a href="index.html">Dashboard v.1</a></li>
                                                <li><a href="index-1.html">Dashboard v.2</a></li>
                                                <li><a href="index-3.html">Dashboard v.3</a></li>
                                                <li><a href="product-list.html">Product List</a></li>
                                                <li><a href="product-edit.html">Product Edit</a></li>
                                                <li><a href="product-detail.html">Product Detail</a></li>
                                                <li><a href="product-cart.html">Product Cart</a></li>
                                                <li><a href="product-payment.html">Product Payment</a></li>
                                                <li><a href="analytics.html">Analytics</a></li>
                                                <li><a href="widgets.html">Widgets</a></li>
                                            </ul>
                                        </li>
                                        <li><a data-toggle="collapse" data-target="#demo" href="#">Mailbox <span class="admin-project-icon adminpro-icon adminpro-down-arrow"></span></a>
                                            <ul id="demo" class="collapse dropdown-header-top">
                                                <li><a href="mailbox.html">Inbox</a>
                                                </li>
                                                <li><a href="mailbox-view.html">View Mail</a>
                                                </li>
                                                <li><a href="mailbox-compose.html">Compose Mail</a>
                                                </li>
                                            </ul>
                                        </li>
                                        <li><a data-toggle="collapse" data-target="#others" href="#">Miscellaneous <span class="admin-project-icon adminpro-icon adminpro-down-arrow"></span></a>
                                            <ul id="others" class="collapse dropdown-header-top">
                                                <li><a href="file-manager.html">File Manager</a></li>
                                                <li><a href="contacts.html">Contacts Client</a></li>
                                                <li><a href="projects.html">Project</a></li>
                                                <li><a href="project-details.html">Project Details</a></li>
                                                <li><a href="blog.html">Blog</a></li>
                                                <li><a href="blog-details.html">Blog Details</a></li>
                                                <li><a href="404.html">404 Page</a></li>
                                                <li><a href="500.html">500 Page</a></li>
                                            </ul>
                                        </li>
                                        <li><a data-toggle="collapse" data-target="#Miscellaneousmob" href="#">Interface <span class="admin-project-icon adminpro-icon adminpro-down-arrow"></span></a>
                                            <ul id="Miscellaneousmob" class="collapse dropdown-header-top">
                                                <li><a href="google-map.html">Google Map</a>
                                                </li>
                                                <li><a href="data-maps.html">Data Maps</a>
                                                </li>
                                                <li><a href="pdf-viewer.html">Pdf Viewer</a>
                                                </li>
                                                <li><a href="x-editable.html">X-Editable</a>
                                                </li>
                                                <li><a href="code-editor.html">Code Editor</a>
                                                </li>
                                                <li><a href="tree-view.html">Tree View</a>
                                                </li>
                                                <li><a href="preloader.html">Preloader</a>
                                                </li>
                                                <li><a href="images-cropper.html">Images Cropper</a>
                                                </li>
                                            </ul>
                                        </li>
                                        <li><a data-toggle="collapse" data-target="#Chartsmob" href="#">Charts <span class="admin-project-icon adminpro-icon adminpro-down-arrow"></span></a>
                                            <ul id="Chartsmob" class="collapse dropdown-header-top">
                                                <li><a href="bar-charts.html">Bar Charts</a>
                                                </li>
                                                <li><a href="line-charts.html">Line Charts</a>
                                                </li>
                                                <li><a href="area-charts.html">Area Charts</a>
                                                </li>
                                                <li><a href="rounded-chart.html">Rounded Charts</a>
                                                </li>
                                                <li><a href="c3.html">C3 Charts</a>
                                                </li>
                                                <li><a href="sparkline.html">Sparkline Charts</a>
                                                </li>
                                                <li><a href="peity.html">Peity Charts</a>
                                                </li>
                                            </ul>
                                        </li>
                                        <li><a data-toggle="collapse" data-target="#Tablesmob" href="#">Tables <span class="admin-project-icon adminpro-icon adminpro-down-arrow"></span></a>
                                            <ul id="Tablesmob" class="collapse dropdown-header-top">
                                                <li><a href="static-table.html">Static Table</a>
                                                </li>
                                                <li><a href="data-table.html">Data Table</a>
                                                </li>
                                            </ul>
                                        </li>
                                        <li><a data-toggle="collapse" data-target="#formsmob" href="#">Forms <span class="admin-project-icon adminpro-icon adminpro-down-arrow"></span></a>
                                            <ul id="formsmob" class="collapse dropdown-header-top">
                                                <li><a href="basic-form-element.html">Basic Form Elements</a>
                                                </li>
                                                <li><a href="advance-form-element.html">Advanced Form Elements</a>
                                                </li>
                                                <li><a href="password-meter.html">Password Meter</a>
                                                </li>
                                                <li><a href="multi-upload.html">Multi Upload</a>
                                                </li>
                                                <li><a href="tinymc.html">Text Editor</a>
                                                </li>
                                                <li><a href="dual-list-box.html">Dual List Box</a>
                                                </li>
                                            </ul>
                                        </li>
                                        <li><a data-toggle="collapse" data-target="#Appviewsmob" href="#">App views <span class="admin-project-icon adminpro-icon adminpro-down-arrow"></span></a>
                                            <ul id="Appviewsmob" class="collapse dropdown-header-top">
                                                <li><a href="basic-form-element.html">Basic Form Elements</a>
                                                </li>
                                                <li><a href="advance-form-element.html">Advanced Form Elements</a>
                                                </li>
                                                <li><a href="password-meter.html">Password Meter</a>
                                                </li>
                                                <li><a href="multi-upload.html">Multi Upload</a>
                                                </li>
                                                <li><a href="tinymc.html">Text Editor</a>
                                                </li>
                                                <li><a href="dual-list-box.html">Dual List Box</a>
                                                </li>
                                            </ul>
                                        </li>
                                        <li><a data-toggle="collapse" data-target="#Pagemob" href="#">Pages <span class="admin-project-icon adminpro-icon adminpro-down-arrow"></span></a>
                                            <ul id="Pagemob" class="collapse dropdown-header-top">
                                                <li><a href="login.html">Login</a>
                                                </li>
                                                <li><a href="register.html">Register</a>
                                                </li>
                                                <li><a href="lock.html">Lock</a>
                                                </li>
                                                <li><a href="password-recovery.html">Password Recovery</a>
                                                </li>
                                            </ul>
                                        </li>
                                    </ul>
                                </nav>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <!-- Mobile Menu end -->
            <div class="breadcome-area">
                <div class="container-fluid">
                    <div class="row">
                        <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
                            <div class="breadcome-list single-page-breadcome">
                                <div class="row">
                                    <div class="col-lg-6 col-md-6 col-sm-6 col-xs-6">
                                        <div class="breadcome-heading">
                                            <form role="search" class="">
                                                <input type="text" placeholder="Search..." class="form-control">
                                                <a href=""><i class="fa fa-search"></i></a>
                                            </form>
                                        </div>
                                    </div>
                                    <div class="col-lg-6 col-md-6 col-sm-6 col-xs-6">
                                        <ul class="breadcome-menu">
                                            <li><a href="#">Home</a> <span class="bread-slash">/</span>
                                            </li>
                                            <li><span class="bread-blod">Buttons</span>
                                            </li>
                                        </ul>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <!-- Button start-->
        <div class="button-adminpro-area mg-tb-15">
            <div class="container-fluid">
                <div class="row">
                    <div class="col-lg-6 col-md-6 col-sm-6 col-xs-12">
                        <div class="button-ad-wrap">
                            <div class="alert-title">
                                <h2>Bootstrap Button</h2>
                                <p>Bootstrap provides different styles of buttons.To achieve the button styles above, Bootstrap has the following classes .btn, .btn-default, .btn-primary, .btn-success, .btn-info, .btn-warning, .btn-danger, .btn-custon-two
                                    etc</p>
                            </div>
                            <div class="button-ap-list responsive-btn">
                                <div class="button-style-four btn-mg-b-10">
                                    <button type="button" class="btn btn-custon-four btn-default">Default</button>
                                    <button type="button" class="btn btn-custon-four btn-primary">Primary</button>
                                    <button type="button" class="btn btn-custon-four btn-success">Success</button>
                                    <button type="button" class="btn btn-custon-four btn-warning">Warning</button>
                                    <button type="button" class="btn btn-custon-four btn-danger">Danger</button>
                                </div>
                                <div class="button-style-two btn-mg-b-10">
                                    <button type="button" class="btn btn-custon-two btn-default">Default</button>
                                    <button type="button" class="btn btn-custon-two btn-primary">Primary</button>
                                    <button type="button" class="btn btn-custon-two btn-success">Success</button>
                                    <button type="button" class="btn btn-custon-two btn-warning">Warning</button>
                                    <button type="button" class="btn btn-custon-two btn-danger">Danger</button>
                                </div>
                                <div class="button-style-three">
                                    <button type="button" class="btn btn-custon-three btn-default">Default</button>
                                    <button type="button" class="btn btn-custon-three btn-primary">Primary</button>
                                    <button type="button" class="btn btn-custon-three btn-success">Success</button>
                                    <button type="button" class="btn btn-custon-three btn-warning">Warning</button>
                                    <button type="button" class="btn btn-custon-three btn-danger">Danger</button>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="col-lg-6 col-md-6 col-sm-6 col-xs-12">
                        <div class="button-ad-wrap res-mg-t-30">
                            <div class="alert-title">
                                <h2>Bootstrap Button with Icon</h2>
                                <p>Bootstrap provides different styles of buttons.To achieve the button styles above, Bootstrap has the following classes .btn, .btn-default, .btn-primary, .btn-success, .btn-info, .btn-warning, .btn-danger, .btn-custon-two
                                    etc</p>
                            </div>
                            <div class="button-ap-list responsive-btn">
                                <div class="button-style-four btn-mg-b-10">
                                    <button type="button" class="btn btn-custon-four btn-default">
											<i class="fa fa-home adminpro-home-admin" aria-hidden="true"></i> Default</button>
                                    <button type="button" class="btn btn-custon-four btn-primary">
											<i class="fa fa-info-circle adminpro-informatio" aria-hidden="true"></i> Primary</button>
                                    <button type="button" class="btn btn-custon-four btn-success">
											<i class="fa fa-check adminpro-checked-pro" aria-hidden="true"></i> Success</button>
                                    <button type="button" class="btn btn-custon-four btn-warning">
											<i class="fa fa-exclamation-triangle adminpro-warning-danger" aria-hidden="true"></i> Warning</button>
                                    <button type="button" class="btn btn-custon-four btn-danger">
											<i class="fa fa-times adminpro-danger-error" aria-hidden="true"></i> Danger</button>
                                </div>
                                <div class="button-style-two btn-mg-b-10">
                                    <button type="button" class="btn btn-custon-two btn-default"> <i class="fa fa-home adminpro-home-admin" aria-hidden="true"></i> Default</button>
                                    <button type="button" class="btn btn-custon-two btn-primary"><i class="fa fa-info-circle adminpro-informatio" aria-hidden="true"></i> Primary</button>
                                    <button type="button" class="btn btn-custon-two btn-success"><i class="fa fa-check adminpro-checked-pro" aria-hidden="true"></i> Success</button>
                                    <button type="button" class="btn btn-custon-two btn-warning"><i class="fa fa-exclamation-triangle adminpro-warning-danger" aria-hidden="true"></i> Warning</button>
                                    <button type="button" class="btn btn-custon-two btn-danger"><i class="fa fa-times adminpro-danger-error" aria-hidden="true"></i> Danger</button>
                                </div>
                                <div class="button-style-three">
                                    <button type="button" class="btn btn-custon-three btn-default"><i class="fa fa-home adminpro-home-admin" aria-hidden="true"></i> Default</button>
                                    <button type="button" class="btn btn-custon-three btn-primary"><i class="fa fa-info-circle adminpro-informatio" aria-hidden="true"></i> Primary</button>
                                    <button type="button" class="btn btn-custon-three btn-success"><i class="fa fa-check adminpro-checked-pro" aria-hidden="true"></i> Success</button>
                                    <button type="button" class="btn btn-custon-three btn-warning"><i class="fa fa-exclamation-triangle adminpro-warning-danger" aria-hidden="true"></i> Warning</button>
                                    <button type="button" class="btn btn-custon-three btn-danger"><i class="fa fa-times adminpro-danger-error" aria-hidden="true"></i> Danger</button>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="row">
                    <div class="col-lg-6 col-md-6 col-sm-6 col-xs-12">
                        <div class="button-ad-wrap mg-tb-30">
                            <div class="alert-title">
                                <h2>Bootstrap Button Sizes</h2>
                                <p>Bootstrap provides four button sizes.The classes that define the different sizes are .btn-lg, .btn-md, .btn-sm, .btn-xs</p>
                            </div>
                            <div class="button-ap-list responsive-btn">
                                <div class="button-style-four btn-mg-b-10">
                                    <button type="button" class="btn btn-custon-four btn-primary btn-lg">Large</button>
                                    <button type="button" class="btn btn-custon-four btn-primary btn-md">Medium</button>
                                    <button type="button" class="btn btn-custon-four btn-primary btn-sm">Small</button>
                                    <button type="button" class="btn btn-custon-four btn-primary btn-xs">XSmall</button>
                                </div>
                                <div class="button-style-two btn-mg-b-10">
                                    <button type="button" class="btn btn-custon-two btn-primary btn-lg">Large</button>
                                    <button type="button" class="btn btn-custon-two btn-primary btn-md">Medium</button>
                                    <button type="button" class="btn btn-custon-two btn-primary btn-sm">Small</button>
                                    <button type="button" class="btn btn-custon-two btn-primary btn-xs">XSmall</button>
                                </div>
                                <div class="button-style-three">
                                    <button type="button" class="btn btn-custon-three btn-primary btn-lg">Large</button>
                                    <button type="button" class="btn btn-custon-three btn-primary btn-md">Medium</button>
                                    <button type="button" class="btn btn-custon-three btn-primary btn-sm">Small</button>
                                    <button type="button" class="btn btn-custon-three btn-primary btn-xs">XSmall</button>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="col-lg-6 col-md-6 col-sm-6 col-xs-12">
                        <div class="button-ad-wrap mg-tb-30">
                            <div class="alert-title">
                                <h2>Bootstrap Button Sizes with Icon</h2>
                                <p>Bootstrap provides four button sizes.The classes that define the different sizes are .btn-lg, .btn-md, .btn-sm, .btn-xs</p>
                            </div>
                            <div class="button-ap-list responsive-btn">
                                <div class="button-style-four btn-mg-b-10">
                                    <button type="button" class="btn btn-custon-four btn-primary btn-lg"><span class="adminpro-icon adminpro-home-admin"></span> Large</button>
                                    <button type="button" class="btn btn-custon-four btn-primary btn-md"><span class="adminpro-icon adminpro-informatio"></span> Medium</button>
                                    <button type="button" class="btn btn-custon-four btn-primary btn-sm"><span class="adminpro-icon adminpro-checked-pro"></span> Small</button>
                                    <button type="button" class="btn btn-custon-four btn-primary btn-xs"><span class="adminpro-icon adminpro-checked-pro"></span> XSmall</button>
                                </div>
                                <div class="button-style-two btn-mg-b-10">
                                    <button type="button" class="btn btn-custon-two btn-primary btn-lg"><span class="adminpro-icon adminpro-home-admin"></span> Large</button>
                                    <button type="button" class="btn btn-custon-two btn-primary btn-md"><span class="adminpro-icon adminpro-informatio"></span> Medium</button>
                                    <button type="button" class="btn btn-custon-two btn-primary btn-sm"><span class="adminpro-icon adminpro-checked-pro"></span> Small</button>
                                    <button type="button" class="btn btn-custon-two btn-primary btn-xs"><span class="adminpro-icon adminpro-checked-pro"></span> XSmall</button>
                                </div>
                                <div class="button-style-three">
                                    <button type="button" class="btn btn-custon-three btn-primary btn-lg"><span class="adminpro-icon adminpro-home-admin"></span> Large</button>
                                    <button type="button" class="btn btn-custon-three btn-primary btn-md"><span class="adminpro-icon adminpro-informatio"></span> Medium</button>
                                    <button type="button" class="btn btn-custon-three btn-primary btn-sm"><span class="adminpro-icon adminpro-checked-pro"></span> Small</button>
                                    <button type="button" class="btn btn-custon-three btn-primary btn-xs"><span class="adminpro-icon adminpro-checked-pro"></span> XSmall</button>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="row">
                    <div class="col-lg-6 col-md-6 col-sm-6 col-xs-12">
                        <div class="button-ad-wrap">
                            <div class="alert-title">
                                <h2>Bootstrap Buttons Rounded</h2>
                                <p>Bootstrap provides different styles of buttons.To achieve the button styles above, Bootstrap has the following classes .btn, .btn-default, .btn-primary, .btn-success, .btn-info, .btn-warning, .btn-danger, .btn-custon-two
                                    etc</p>
                            </div>
                            <div class="button-ap-list responsive-btn">
                                <div class="button-style-four btn-mg-b-10">
                                    <button type="button" class="btn btn-custon-rounded-four btn-default">Default</button>
                                    <button type="button" class="btn btn-custon-rounded-four btn-primary">Primary</button>
                                    <button type="button" class="btn btn-custon-rounded-four btn-success">Success</button>
                                    <button type="button" class="btn btn-custon-rounded-four btn-warning">Warning</button>
                                    <button type="button" class="btn btn-custon-rounded-four btn-danger">Danger</button>
                                </div>
                                <div class="button-style-two btn-mg-b-10">
                                    <button type="button" class="btn btn-custon-rounded-two btn-default">Default</button>
                                    <button type="button" class="btn btn-custon-rounded-two btn-primary">Primary</button>
                                    <button type="button" class="btn btn-custon-rounded-two btn-success">Success</button>
                                    <button type="button" class="btn btn-custon-rounded-two btn-warning">Warning</button>
                                    <button type="button" class="btn btn-custon-rounded-two btn-danger">Danger</button>
                                </div>
                                <div class="button-style-three">
                                    <button type="button" class="btn btn-custon-rounded-three btn-default">Default</button>
                                    <button type="button" class="btn btn-custon-rounded-three btn-primary">Primary</button>
                                    <button type="button" class="btn btn-custon-rounded-three btn-success">Success</button>
                                    <button type="button" class="btn btn-custon-rounded-three btn-warning">Warning</button>
                                    <button type="button" class="btn btn-custon-rounded-three btn-danger">Danger</button>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="col-lg-6 col-md-6 col-sm-6 col-xs-12">
                        <div class="button-ad-wrap res-mg-t-30">
                            <div class="alert-title">
                                <h2>Bootstrap Buttons Rounded with Icon</h2>
                                <p>Bootstrap provides different styles of buttons.To achieve the button styles above, Bootstrap has the following classes .btn, .btn-default, .btn-primary, .btn-success, .btn-info, .btn-warning, .btn-danger, .btn-custon-two
                                    etc</p>
                            </div>
                            <div class="button-ap-list responsive-btn">
                                <div class="button-style-four btn-mg-b-10">
                                    <button type="button" class="btn btn-custon-rounded-four btn-default"><i class="fa fa-home adminpro-home-admin" aria-hidden="true"></i> Default</button>
                                    <button type="button" class="btn btn-custon-rounded-four btn-primary"><i class="fa fa-info-circle adminpro-informatio" aria-hidden="true"></i> Primary</button>
                                    <button type="button" class="btn btn-custon-four btn-success"><i class="fa fa-check adminpro-checked-pro" aria-hidden="true"></i> Success</button>
                                    <button type="button" class="btn btn-custon-rounded-four btn-warning"><i class="fa fa-exclamation-triangle adminpro-warning-danger" aria-hidden="true"></i> Warning</button>
                                    <button type="button" class="btn btn-custon-rounded-four btn-danger"><i class="fa fa-times adminpro-danger-error" aria-hidden="true"></i> Danger</button>
                                </div>
                                <div class="button-style-two btn-mg-b-10">
                                    <button type="button" class="btn btn-custon-rounded-two btn-default"><i class="fa fa-home adminpro-home-admin" aria-hidden="true"></i> Default</button>
                                    <button type="button" class="btn btn-custon-rounded-two btn-primary"><i class="fa fa-info-circle adminpro-informatio" aria-hidden="true"></i> Primary</button>
                                    <button type="button" class="btn btn-custon-rounded-two btn-success"><i class="fa fa-check adminpro-checked-pro" aria-hidden="true"></i> Success</button>
                                    <button type="button" class="btn btn-custon-rounded-two btn-warning"><i class="fa fa-exclamation-triangle adminpro-warning-danger" aria-hidden="true"></i> Warning</button>
                                    <button type="button" class="btn btn-custon-rounded-two btn-danger"><i class="fa fa-times adminpro-danger-error" aria-hidden="true"></i> Danger</button>
                                </div>
                                <div class="button-style-three">
                                    <button type="button" class="btn btn-custon-rounded-three btn-default"><i class="fa fa-home adminpro-home-admin" aria-hidden="true"></i> Default</button>
                                    <button type="button" class="btn btn-custon-rounded-three btn-primary"><i class="fa fa-info-circle adminpro-informatio" aria-hidden="true"></i> Primary</button>
                                    <button type="button" class="btn btn-custon-rounded-three btn-success"><i class="fa fa-check adminpro-checked-pro" aria-hidden="true"></i> Success</button>
                                    <button type="button" class="btn btn-custon-rounded-three btn-warning"><i class="fa fa-exclamation-triangle adminpro-warning-danger" aria-hidden="true"></i> Warning</button>
                                    <button type="button" class="btn btn-custon-rounded-three btn-danger"><i class="fa fa-times adminpro-danger-error" aria-hidden="true"></i> Danger</button>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="row">
                    <div class="col-lg-6 col-md-6 col-sm-6 col-xs-12">
                        <div class="button-ad-wrap mg-tb-30">
                            <div class="alert-title">
                                <h2>Bootstrap Button Groups</h2>
                                <p>Bootstrap allows you to group a series of buttons together (on a single line) in a button group. Use a div element with class .btn-group to create a button group.</p>
                            </div>
                            <div class="button-ap-list responsive-btn">
                                <div class="btn-group btn-custom-groups btn-custom-groups-one btn-mg-b-10">
                                    <button type="button" class="btn btn-primary">Default</button>
                                    <button type="button" class="btn btn-primary">Primary</button>
                                    <button type="button" class="btn btn-primary">Success</button>
                                    <button type="button" class="btn btn-primary">Warning</button>
                                    <button type="button" class="btn btn-primary">Danger</button>
                                </div>
                                <div class="btn-group btn-custom-groups">
                                    <button type="button" class="btn btn-primary">Default</button>
                                    <button type="button" class="btn btn-primary">Primary</button>
                                    <button type="button" class="btn btn-primary">Success</button>
                                    <button type="button" class="btn btn-primary">Warning</button>
                                    <button type="button" class="btn btn-primary">Danger</button>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="col-lg-6 col-md-6 col-sm-6 col-xs-12">
                        <div class="button-ad-wrap mg-tb-30">
                            <div class="alert-title">
                                <h2>Bootstrap Button Groups With Icon</h2>
                                <p>Bootstrap allows you to group a series of buttons together (on a single line) in a button group. Use a div element with class .btn-group to create a button group.</p>
                            </div>
                            <div class="button-ap-list responsive-btn">
                                <div class="btn-group btn-custom-groups btn-custom-groups-one btn-mg-b-10">
                                    <button type="button" class="btn btn-primary"><i class="fa fa-home adminpro-home-admin" aria-hidden="true"></i> Default</button>
                                    <button type="button" class="btn btn-primary"><i class="fa fa-info-circle adminpro-informatio" aria-hidden="true"></i> Primary</button>
                                    <button type="button" class="btn btn-primary"><i class="fa fa-check adminpro-checked-pro" aria-hidden="true"></i> Success</button>
                                    <button type="button" class="btn btn-primary"><i class="fa fa-exclamation-triangle adminpro-warning-danger" aria-hidden="true"></i> Warning</button>
                                    <button type="button" class="btn btn-primary"><i class="fa fa-times adminpro-danger-error" aria-hidden="true"></i> Danger</button>
                                </div>
                                <div class="btn-group btn-custom-groups">
                                    <button type="button" class="btn btn-primary"><i class="fa fa-home adminpro-home-admin" aria-hidden="true"></i> Default</button>
                                    <button type="button" class="btn btn-primary"><i class="fa fa-info-circle adminpro-informatio" aria-hidden="true"></i> Primary</button>
                                    <button type="button" class="btn btn-primary"><i class="fa fa-check adminpro-checked-pro" aria-hidden="true"></i> Success</button>
                                    <button type="button" class="btn btn-primary"><i class="fa fa-exclamation-triangle adminpro-warning-danger" aria-hidden="true"></i> Warning</button>
                                    <button type="button" class="btn btn-primary"><i class="fa fa-times adminpro-danger-error" aria-hidden="true"></i> Danger</button>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="row">
                    <div class="col-lg-6 col-md-6 col-sm-6 col-xs-12">
                        <div class="button-ad-wrap">
                            <div class="alert-title">
                                <h2>Nesting Button Groups & Dropdown Menus</h2>
                                <p>Bootstrap allows you to group a series of buttons together (on a single line) in a button group. Use a div element with class .btn-group, .dropdown-toggle to create a button group.</p>
                            </div>
                            <div class="button-ap-list responsive-btn">
                                <div class="btn-group btn-custom-groups btn-custom-groups-one btn-mg-b-10">
                                    <button type="button" class="btn btn-primary dropdown-toggle" data-toggle="dropdown">Default <i class="fa fa-angle-down"></i>
										</button>
                                    <ul class="dropdown-menu btn-dropdown-menu" role="menu">
                                        <li><a href="#">Action</a>
                                        </li>
                                        <li><a href="#">Another action</a>
                                        </li>
                                        <li><a href="#">Something else here</a>
                                        </li>
                                        <li><a href="#">Separated link</a>
                                        </li>
                                        <li>
                                            <div class="btn-setting-icon">
                                                <div class="btn-icon-st">
                                                    <a href="#"><i class="fa fa-cloud-download adminpro-cloud-computing-down" aria-hidden="true"></i></a>
                                                </div>
                                                <div class="btn-icon-st">
                                                    <a href="#"><i class="fa fa-cog adminpro-settings" aria-hidden="true"></i></a>
                                                </div>
                                            </div>
                                        </li>
                                    </ul>
                                    <button type="button" class="btn btn-primary">Primary</button>
                                    <button type="button" class="btn btn-primary">Success</button>
                                    <button type="button" class="btn btn-primary">Warning</button>
                                    <button type="button" class="btn btn-primary">Danger</button>
                                </div>
                                <div class="btn-group btn-custom-groups">
                                    <button type="button" class="btn btn-primary dropdown-toggle" data-toggle="dropdown">Default <i class="fa fa-angle-down"></i>
										</button>
                                    <ul class="dropdown-menu btn-dropdown-menu" role="menu">
                                        <li><a href="#">Action</a>
                                        </li>
                                        <li><a href="#">Another action</a>
                                        </li>
                                        <li><a href="#">Something else here</a>
                                        </li>
                                        <li><a href="#">Separated link</a>
                                        </li>
                                        <li>
                                            <div class="btn-setting-icon">
                                                <div class="btn-icon-st">
                                                    <a href="#"><i class="fa fa-cloud-download adminpro-cloud-computing-down" aria-hidden="true"></i></a>
                                                </div>
                                                <div class="btn-icon-st">
                                                    <a href="#"><i class="fa fa-cog adminpro-settings" aria-hidden="true"></i></a>
                                                </div>
                                            </div>
                                        </li>
                                    </ul>
                                    <button type="button" class="btn btn-primary">Primary</button>
                                    <button type="button" class="btn btn-primary">Success</button>
                                    <button type="button" class="btn btn-primary">Warning</button>
                                    <button type="button" class="btn btn-primary">Danger</button>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="col-lg-6 col-md-6 col-sm-6 col-xs-12">
                        <div class="button-ad-wrap res-mg-t-30">
                            <div class="alert-title">
                                <h2>Nesting Button Groups With Icon & Dropdown Menus</h2>
                                <p>Bootstrap allows you to group a series of buttons together (on a single line) in a button group. Use a div element with class .btn-group, .dropdown-toggle to create a button group.</p>
                            </div>
                            <div class="button-ap-list responsive-btn">
                                <div class="btn-group btn-custom-groups btn-custom-groups-one btn-mg-b-10">
                                    <button type="button" class="btn btn-primary dropdown-toggle" data-toggle="dropdown"><i class="fa fa-home adminpro-home-admin" aria-hidden="true"></i> Default <i class="fa fa-angle-down"></i>
										</button>
                                    <ul class="dropdown-menu btn-dropdown-menu" role="menu">
                                        <li><a href="#">Action</a>
                                        </li>
                                        <li><a href="#">Another action</a>
                                        </li>
                                        <li><a href="#">Something else here</a>
                                        </li>
                                        <li><a href="#">Separated link</a>
                                        </li>
                                        <li>
                                            <div class="btn-setting-icon">
                                                <div class="btn-icon-st">
                                                    <a href="#"><i class="fa fa-cloud-download adminpro-cloud-computing-down" aria-hidden="true"></i></a>
                                                </div>
                                                <div class="btn-icon-st">
                                                    <a href="#"><i class="fa fa-cog adminpro-settings" aria-hidden="true"></i></a>
                                                </div>
                                            </div>
                                        </li>
                                    </ul>
                                    <button type="button" class="btn btn-primary"><i class="fa fa-info-circle adminpro-informatio" aria-hidden="true"></i> Primary</button>
                                    <button type="button" class="btn btn-primary"><i class="fa fa-check adminpro-checked-pro" aria-hidden="true"></i> Success</button>
                                    <button type="button" class="btn btn-primary"><i class="fa fa-exclamation-triangle adminpro-warning-danger" aria-hidden="true"></i> Warning</button>
                                    <button type="button" class="btn btn-primary"><i class="fa fa-times adminpro-danger-error" aria-hidden="true"></i> Danger</button>
                                </div>
                                <div class="btn-group btn-custom-groups">
                                    <button type="button" class="btn btn-primary dropdown-toggle" data-toggle="dropdown"><i class="fa fa-home adminpro-home-admin" aria-hidden="true"></i> Default <i class="fa fa-angle-down"></i>
										</button>
                                    <ul class="dropdown-menu btn-dropdown-menu" role="menu">
                                        <li><a href="#">Action</a>
                                        </li>
                                        <li><a href="#">Another action</a>
                                        </li>
                                        <li><a href="#">Something else here</a>
                                        </li>
                                        <li><a href="#">Separated link</a>
                                        </li>
                                        <li>
                                            <div class="btn-setting-icon">
                                                <div class="btn-icon-st">
                                                    <a href="#"><i class="fa fa-cloud-download adminpro-cloud-computing-down" aria-hidden="true"></i></a>
                                                </div>
                                                <div class="btn-icon-st">
                                                    <a href="#"><i class="fa fa-cog adminpro-settings" aria-hidden="true"></i></a>
                                                </div>
                                            </div>
                                        </li>
                                    </ul>
                                    <button type="button" class="btn btn-primary"><i class="fa fa-info-circle adminpro-informatio" aria-hidden="true"></i> Primary</button>
                                    <button type="button" class="btn btn-primary"><i class="fa fa-check adminpro-checked-pro" aria-hidden="true"></i> Success</button>
                                    <button type="button" class="btn btn-primary"><i class="fa fa-exclamation-triangle adminpro-warning-danger" aria-hidden="true"></i> Warning</button>
                                    <button type="button" class="btn btn-primary"><i class="fa fa-times adminpro-danger-error" aria-hidden="true"></i> Danger</button>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="row">
                    <div class="col-lg-6 col-md-6 col-sm-6 col-xs-12">
                        <div class="button-ad-wrap mg-tb-30">
                            <div class="alert-title">
                                <h2>Split Button Dropdowns</h2>
                                <p>Bootstrap provides different styles of buttons. Jump to Split button dropdowns - Similarly, create split button dropdowns with virtually the same markup as single button dropdowns.</p>
                            </div>
                            <div class="button-ap-list responsive-btn">
                                <div class="button-style-four">
                                    <div class="button-drop-style-one btn-default-bg">
                                        <button type="button" class="btn btn-custon-four btn-default dropdown-toggle1" data-toggle="dropdown">Default <i class="fa fa-angle-down"></i>
											</button>
                                        <ul class="dropdown-menu btn-dropdown-menu another-drop-pro-two dropdown-toggle1" role="menu">
                                            <li><a href="#">Action</a>
                                            </li>
                                            <li><a href="#">Another action</a>
                                            </li>
                                            <li><a href="#">Something else here</a>
                                            </li>
                                            <li><a href="#">Separated link</a>
                                            </li>
                                            <li>
                                                <div class="btn-setting-icon">
                                                    <div class="btn-icon-st">
                                                        <a href="#"><i class="fa fa-cloud-download adminpro-cloud-computing-down" aria-hidden="true"></i></a>
                                                    </div>
                                                    <div class="btn-icon-st">
                                                        <a href="#"><i class="fa fa-cog adminpro-settings" aria-hidden="true"></i></a>
                                                    </div>
                                                </div>
                                            </li>
                                        </ul>
                                    </div>
                                    <div class="button-drop-style-one">
                                        <button type="button" class="btn btn-custon-four btn-primary dropdown-toggle" data-toggle="dropdown">Primary <i class="fa fa-angle-down"></i>
											</button>
                                        <ul class="dropdown-menu btn-dropdown-menu another-drop-pro-one" role="menu">
                                            <li><a href="#">Action</a>
                                            </li>
                                            <li><a href="#">Another action</a>
                                            </li>
                                            <li><a href="#">Something else here</a>
                                            </li>
                                            <li><a href="#">Separated link</a>
                                            </li>
                                            <li>
                                                <div class="btn-setting-icon">
                                                    <div class="btn-icon-st">
                                                        <a href="#"><i class="fa fa-cloud-download adminpro-cloud-computing-down" aria-hidden="true"></i></a>
                                                    </div>
                                                    <div class="btn-icon-st">
                                                        <a href="#"><i class="fa fa-cog adminpro-settings" aria-hidden="true"></i></a>
                                                    </div>
                                                </div>
                                            </li>
                                        </ul>
                                    </div>
                                    <div class="button-drop-style-one btn-success-bg">
                                        <button type="button" class="btn btn-custon-four btn-success dropdown-toggle" data-toggle="dropdown">Success <i class="fa fa-angle-down"></i>
											</button>
                                        <ul class="dropdown-menu btn-dropdown-menu another-drop-pro-three" role="menu">
                                            <li><a href="#">Action</a>
                                            </li>
                                            <li><a href="#">Another action</a>
                                            </li>
                                            <li><a href="#">Something else here</a>
                                            </li>
                                            <li><a href="#">Separated link</a>
                                            </li>
                                            <li>
                                                <div class="btn-setting-icon">
                                                    <div class="btn-icon-st">
                                                        <a href="#"><i class="fa fa-cloud-download adminpro-cloud-computing-down" aria-hidden="true"></i></a>
                                                    </div>
                                                    <div class="btn-icon-st">
                                                        <a href="#"><i class="fa fa-cog adminpro-settings" aria-hidden="true"></i></a>
                                                    </div>
                                                </div>
                                            </li>
                                        </ul>
                                    </div>
                                    <div class="button-drop-style-one btn-warning-bg">
                                        <button type="button" class="btn btn-custon-four btn-warning dropdown-toggle" data-toggle="dropdown">Warning <i class="fa fa-angle-down"></i>
											</button>
                                        <ul class="dropdown-menu btn-dropdown-menu another-drop-pro-four" role="menu">
                                            <li><a href="#">Action</a>
                                            </li>
                                            <li><a href="#">Another action</a>
                                            </li>
                                            <li><a href="#">Something else here</a>
                                            </li>
                                            <li><a href="#">Separated link</a>
                                            </li>
                                            <li>
                                                <div class="btn-setting-icon">
                                                    <div class="btn-icon-st">
                                                        <a href="#"><i class="fa fa-cloud-download adminpro-cloud-computing-down" aria-hidden="true"></i></a>
                                                    </div>
                                                    <div class="btn-icon-st">
                                                        <a href="#"><i class="fa fa-cog adminpro-settings" aria-hidden="true"></i></a>
                                                    </div>
                                                </div>
                                            </li>
                                        </ul>
                                    </div>
                                    <div class="button-drop-style-one btn-danger-bg">
                                        <button type="button" class="btn btn-custon-four btn-danger dropdown-toggle" data-toggle="dropdown">Danger <i class="fa fa-angle-down"></i>
											</button>
                                        <ul class="dropdown-menu btn-dropdown-menu another-drop-pro-five" role="menu">
                                            <li><a href="#">Action</a>
                                            </li>
                                            <li><a href="#">Another action</a>
                                            </li>
                                            <li><a href="#">Something else here</a>
                                            </li>
                                            <li><a href="#">Separated link</a>
                                            </li>
                                            <li>
                                                <div class="btn-setting-icon">
                                                    <div class="btn-icon-st">
                                                        <a href="#"><i class="fa fa-cloud-download adminpro-cloud-computing-down" aria-hidden="true"></i></a>
                                                    </div>
                                                    <div class="btn-icon-st">
                                                        <a href="#"><i class="fa fa-cog adminpro-settings" aria-hidden="true"></i></a>
                                                    </div>
                                                </div>
                                            </li>
                                        </ul>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="col-lg-6 col-md-6 col-sm-6 col-xs-12">
                        <div class="button-ad-wrap mg-tb-30">
                            <div class="alert-title">
                                <h2>Split Button Dropdowns with Icon</h2>
                                <p>Bootstrap provides different styles of buttons. Jump to Split button dropdowns - Similarly, create split button with Icon dropdowns with virtually the same markup as single button dropdowns.</p>
                            </div>
                            <div class="button-ap-list responsive-btn">
                                <div class="button-style-four">
                                    <div class="button-drop-style-two btn-default-bg">
                                        <button type="button" class="btn btn-custon-four btn-default dropdown-toggle" data-toggle="dropdown"><i class="fa fa-home adminpro-home-admin" aria-hidden="true"></i> Default <i class="fa fa-angle-down"></i>
											</button>
                                        <ul class="dropdown-menu btn-dropdown-menu another-drop-pro-six" role="menu">
                                            <li><a href="#">Action</a>
                                            </li>
                                            <li><a href="#">Another action</a>
                                            </li>
                                            <li><a href="#">Something else here</a>
                                            </li>
                                            <li><a href="#">Separated link</a>
                                            </li>
                                            <li>
                                                <div class="btn-setting-icon">
                                                    <div class="btn-icon-st">
                                                        <a href="#"><i class="fa fa-cloud-download adminpro-cloud-computing-down" aria-hidden="true"></i></a>
                                                    </div>
                                                    <div class="btn-icon-st">
                                                        <a href="#"><i class="fa fa-cog adminpro-settings" aria-hidden="true"></i></a>
                                                    </div>
                                                </div>
                                            </li>
                                        </ul>
                                    </div>
                                    <div class="button-drop-style-two">
                                        <button type="button" class="btn btn-custon-four btn-primary dropdown-toggle" data-toggle="dropdown"><i class="fa fa-info-circle adminpro-informatio" aria-hidden="true"></i> Primary <i class="fa fa-angle-down"></i>
											</button>
                                        <ul class="dropdown-menu btn-dropdown-menu another-drop-pro-seven" role="menu">
                                            <li><a href="#">Action</a>
                                            </li>
                                            <li><a href="#">Another action</a>
                                            </li>
                                            <li><a href="#">Something else here</a>
                                            </li>
                                            <li><a href="#">Separated link</a>
                                            </li>
                                            <li>
                                                <div class="btn-setting-icon">
                                                    <div class="btn-icon-st">
                                                        <a href="#"><i class="fa fa-cloud-download adminpro-cloud-computing-down" aria-hidden="true"></i></a>
                                                    </div>
                                                    <div class="btn-icon-st">
                                                        <a href="#"><i class="fa fa-cog adminpro-settings" aria-hidden="true"></i></a>
                                                    </div>
                                                </div>
                                            </li>
                                        </ul>
                                    </div>
                                    <div class="button-drop-style-two btn-success-bg">
                                        <button type="button" class="btn btn-custon-four btn-success dropdown-toggle" data-toggle="dropdown"><i class="fa fa-check adminpro-checked-pro" aria-hidden="true"></i> Success <i class="fa fa-angle-down"></i>
											</button>
                                        <ul class="dropdown-menu btn-dropdown-menu another-drop-pro-eight" role="menu">
                                            <li><a href="#">Action</a>
                                            </li>
                                            <li><a href="#">Another action</a>
                                            </li>
                                            <li><a href="#">Something else here</a>
                                            </li>
                                            <li><a href="#">Separated link</a>
                                            </li>
                                            <li>
                                                <div class="btn-setting-icon">
                                                    <div class="btn-icon-st">
                                                        <a href="#"><i class="fa fa-cloud-download adminpro-cloud-computing-down" aria-hidden="true"></i></a>
                                                    </div>
                                                    <div class="btn-icon-st">
                                                        <a href="#"><i class="fa fa-cog adminpro-settings" aria-hidden="true"></i></a>
                                                    </div>
                                                </div>
                                            </li>
                                        </ul>
                                    </div>
                                    <div class="button-drop-style-two btn-warning-bg">
                                        <button type="button" class="btn btn-custon-four btn-warning dropdown-toggle" data-toggle="dropdown"><i class="fa fa-exclamation-triangle adminpro-warning-danger" aria-hidden="true"></i> Warning <i class="fa fa-angle-down"></i>
											</button>
                                        <ul class="dropdown-menu btn-dropdown-menu another-drop-pro-nine" role="menu">
                                            <li><a href="#">Action</a>
                                            </li>
                                            <li><a href="#">Another action</a>
                                            </li>
                                            <li><a href="#">Something else here</a>
                                            </li>
                                            <li><a href="#">Separated link</a>
                                            </li>
                                            <li>
                                                <div class="btn-setting-icon">
                                                    <div class="btn-icon-st">
                                                        <a href="#"><i class="fa fa-cloud-download adminpro-cloud-computing-down" aria-hidden="true"></i></a>
                                                    </div>
                                                    <div class="btn-icon-st">
                                                        <a href="#"><i class="fa fa-cog adminpro-settings" aria-hidden="true"></i></a>
                                                    </div>
                                                </div>
                                            </li>
                                        </ul>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="row">
                    <div class="col-lg-6 col-md-6 col-sm-6 col-xs-12">
                        <div class="button-ad-wrap">
                            <div class="alert-title">
                                <h2>Split Button Dropdowns</h2>
                                <p>Bootstrap provides different styles of buttons. Jump to Split button dropdowns - Similarly, create split button dropdowns with virtually the same markup as single button dropdowns.</p>
                            </div>
                            <div class="button-ap-list responsive-btn">
                                <div class="button-style-four">
                                    <div class="button-drop-style-one btn-default-bg">
                                        <button type="button" class="btn btn-custon-four btn-default">Default</button>
                                        <button class="btn-button-ct dropdown-toggle" data-toggle="dropdown"><i class="fa fa-angle-down"></i>
											</button>
                                        <ul class="dropdown-menu btn-dropdown-menu another-drop-pro-two dropdown-toggle" role="menu">
                                            <li><a href="#">Action</a>
                                            </li>
                                            <li><a href="#">Another action</a>
                                            </li>
                                            <li><a href="#">Something else here</a>
                                            </li>
                                            <li><a href="#">Separated link</a>
                                            </li>
                                            <li>
                                                <div class="btn-setting-icon">
                                                    <div class="btn-icon-st">
                                                        <a href="#"><i class="fa fa-cloud-download adminpro-cloud-computing-down" aria-hidden="true"></i></a>
                                                    </div>
                                                    <div class="btn-icon-st">
                                                        <a href="#"><i class="fa fa-cog adminpro-settings" aria-hidden="true"></i></a>
                                                    </div>
                                                </div>
                                            </li>
                                        </ul>
                                    </div>
                                    <div class="button-drop-style-one">
                                        <button type="button" class="btn btn-custon-four btn-primary">Primary</button>
                                        <button class="btn-button-ct btn-button-primary-ct dropdown-toggle" data-toggle="dropdown"><i class="fa fa-angle-down"></i>
											</button>
                                        <ul class="dropdown-menu btn-dropdown-menu another-drop-pro-ten" role="menu">
                                            <li><a href="#">Action</a>
                                            </li>
                                            <li><a href="#">Another action</a>
                                            </li>
                                            <li><a href="#">Something else here</a>
                                            </li>
                                            <li><a href="#">Separated link</a>
                                            </li>
                                            <li>
                                                <div class="btn-setting-icon">
                                                    <div class="btn-icon-st">
                                                        <a href="#"><i class="fa fa-cloud-download adminpro-cloud-computing-down" aria-hidden="true"></i></a>
                                                    </div>
                                                    <div class="btn-icon-st">
                                                        <a href="#"><i class="fa fa-cog adminpro-settings" aria-hidden="true"></i></a>
                                                    </div>
                                                </div>
                                            </li>
                                        </ul>
                                    </div>
                                    <div class="button-drop-style-one btn-warning-bg">
                                        <button type="button" class="btn btn-custon-four btn-warning">Warning</button>
                                        <button class="btn-button-ct btn-button-warning-ct dropdown-toggle" data-toggle="dropdown"><i class="fa fa-angle-down"></i>
											</button>
                                        <ul class="dropdown-menu btn-dropdown-menu another-drop-pro-eleven" role="menu">
                                            <li><a href="#">Action</a>
                                            </li>
                                            <li><a href="#">Another action</a>
                                            </li>
                                            <li><a href="#">Something else here</a>
                                            </li>
                                            <li><a href="#">Separated link</a>
                                            </li>
                                            <li>
                                                <div class="btn-setting-icon">
                                                    <div class="btn-icon-st">
                                                        <a href="#"><i class="fa fa-cloud-download adminpro-cloud-computing-down" aria-hidden="true"></i></a>
                                                    </div>
                                                    <div class="btn-icon-st">
                                                        <a href="#"><i class="fa fa-cog adminpro-settings" aria-hidden="true"></i></a>
                                                    </div>
                                                </div>
                                            </li>
                                        </ul>
                                    </div>
                                    <div class="button-drop-style-one btn-danger-bg">
                                        <button type="button" class="btn btn-custon-four btn-danger">Danger</button>
                                        <button class="btn-button-ct btn-button-danger-ct dropdown-toggle" data-toggle="dropdown"><i class="fa fa-angle-down"></i>
											</button>
                                        <ul class="dropdown-menu btn-dropdown-menu another-drop-pro-twevel" role="menu">
                                            <li><a href="#">Action</a>
                                            </li>
                                            <li><a href="#">Another action</a>
                                            </li>
                                            <li><a href="#">Something else here</a>
                                            </li>
                                            <li><a href="#">Separated link</a>
                                            </li>
                                            <li>
                                                <div class="btn-setting-icon">
                                                    <div class="btn-icon-st">
                                                        <a href="#"><i class="fa fa-cloud-download adminpro-cloud-computing-down" aria-hidden="true"></i></a>
                                                    </div>
                                                    <div class="btn-icon-st">
                                                        <a href="#"><i class="fa fa-cog adminpro-settings" aria-hidden="true"></i></a>
                                                    </div>
                                                </div>
                                            </li>
                                        </ul>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="col-lg-6 col-md-6 col-sm-6 col-xs-12">
                        <div class="button-ad-wrap res-mg-t-30">
                            <div class="alert-title">
                                <h2>Split Button Dropdowns with Icon</h2>
                                <p>Bootstrap provides different styles of buttons. Jump to Split button dropdowns - Similarly, create split button with Icon dropdowns with virtually the same markup as single button dropdowns.</p>
                            </div>
                            <div class="button-ap-list responsive-btn">
                                <div class="button-style-four">
                                    <div class="button-drop-style-one btn-default-bg">
                                        <button type="button" class="btn btn-custon-four btn-default"><i class="fa fa-home adminpro-home-admin" aria-hidden="true"></i> Default</button>
                                        <button class="btn-button-ct dropdown-toggle" data-toggle="dropdown"><i class="fa fa-angle-down"></i>
											</button>
                                        <ul class="dropdown-menu btn-dropdown-menu another-drop-pro-two dropdown-toggle" role="menu">
                                            <li><a href="#">Action</a>
                                            </li>
                                            <li><a href="#">Another action</a>
                                            </li>
                                            <li><a href="#">Something else here</a>
                                            </li>
                                            <li><a href="#">Separated link</a>
                                            </li>
                                            <li>
                                                <div class="btn-setting-icon">
                                                    <div class="btn-icon-st">
                                                        <a href="#"><i class="fa fa-cloud-download adminpro-cloud-computing-down" aria-hidden="true"></i></a>
                                                    </div>
                                                    <div class="btn-icon-st">
                                                        <a href="#"><i class="fa fa-cog adminpro-settings" aria-hidden="true"></i></a>
                                                    </div>
                                                </div>
                                            </li>
                                        </ul>
                                    </div>
                                    <div class="button-drop-style-one">
                                        <button type="button" class="btn btn-custon-four btn-primary primary-btn-cl"><i class="fa fa-info-circle adminpro-informatio" aria-hidden="true"></i> Primary</button>
                                        <button class="btn-button-ct btn-button-primary-ct dropdown-toggle" data-toggle="dropdown"><i class="fa fa-angle-down"></i>
											</button>
                                        <ul class="dropdown-menu btn-dropdown-menu another-drop-pro-ten" role="menu">
                                            <li><a href="#">Action</a>
                                            </li>
                                            <li><a href="#">Another action</a>
                                            </li>
                                            <li><a href="#">Something else here</a>
                                            </li>
                                            <li><a href="#">Separated link</a>
                                            </li>
                                            <li>
                                                <div class="btn-setting-icon">
                                                    <div class="btn-icon-st">
                                                        <a href="#"><i class="fa fa-cloud-download adminpro-cloud-computing-down" aria-hidden="true"></i></a>
                                                    </div>
                                                    <div class="btn-icon-st">
                                                        <a href="#"><i class="fa fa-cog adminpro-settings" aria-hidden="true"></i></a>
                                                    </div>
                                                </div>
                                            </li>
                                        </ul>
                                    </div>
                                    <div class="button-drop-style-one btn-warning-bg">
                                        <button type="button" class="btn btn-custon-four btn-warning warning-btn-cl"><i class="fa fa-check adminpro-checked-pro" aria-hidden="true"></i> Warning</button>
                                        <button class="btn-button-ct btn-button-warning-ct dropdown-toggle" data-toggle="dropdown"><i class="fa fa-angle-down"></i>
											</button>
                                        <ul class="dropdown-menu btn-dropdown-menu another-drop-pro-eleven" role="menu">
                                            <li><a href="#">Action</a>
                                            </li>
                                            <li><a href="#">Another action</a>
                                            </li>
                                            <li><a href="#">Something else here</a>
                                            </li>
                                            <li><a href="#">Separated link</a>
                                            </li>
                                            <li>
                                                <div class="btn-setting-icon">
                                                    <div class="btn-icon-st">
                                                        <a href="#"><i class="fa fa-cloud-download adminpro-cloud-computing-down" aria-hidden="true"></i></a>
                                                    </div>
                                                    <div class="btn-icon-st">
                                                        <a href="#"><i class="fa fa-cog adminpro-settings" aria-hidden="true"></i></a>
                                                    </div>
                                                </div>
                                            </li>
                                        </ul>
                                    </div>
                                    <div class="button-drop-style-one btn-danger-bg">
                                        <button type="button" class="btn btn-custon-four btn-danger danger-btn-cl"><i class="fa fa-exclamation-triangle adminpro-warning-danger" aria-hidden="true"></i> Danger</button>
                                        <button class="btn-button-ct btn-button-danger-ct dropdown-toggle" data-toggle="dropdown"><i class="fa fa-angle-down"></i>
											</button>
                                        <ul class="dropdown-menu btn-dropdown-menu another-drop-pro-twevel" role="menu">
                                            <li><a href="#">Action</a>
                                            </li>
                                            <li><a href="#">Another action</a>
                                            </li>
                                            <li><a href="#">Something else here</a>
                                            </li>
                                            <li><a href="#">Separated link</a>
                                            </li>
                                            <li>
                                                <div class="btn-setting-icon">
                                                    <div class="btn-icon-st">
                                                        <a href="#"><i class="fa fa-cloud-download adminpro-cloud-computing-down" aria-hidden="true"></i></a>
                                                    </div>
                                                    <div class="btn-icon-st">
                                                        <a href="#"><i class="fa fa-cog adminpro-settings" aria-hidden="true"></i></a>
                                                    </div>
                                                </div>
                                            </li>
                                        </ul>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="row">
                    <div class="col-lg-6 col-md-6 col-sm-6 col-xs-12">
                        <div class="button-ad-wrap mg-tb-30">
                            <div class="alert-title">
                                <h2>Vertical Button Groups</h2>
                                <p>Bootstrap also supports vertical button groups.Use the class .btn-group-vertical to create a vertical button group.</p>
                            </div>
                            <div class="button-ap-list responsive-btn">
                                <div class="btn-group-vertical btn-custom-groups btn-custom-groups-one">
                                    <button type="button" class="btn btn-primary">Default</button>
                                    <button type="button" class="btn btn-primary">Primary</button>
                                    <button type="button" class="btn btn-primary">Success</button>
                                    <button type="button" class="btn btn-primary">Warning</button>
                                    <button type="button" class="btn btn-primary">Danger</button>
                                </div>
                                <div class="btn-group-vertical btn-custom-groups">
                                    <button type="button" class="btn btn-primary">Default</button>
                                    <button type="button" class="btn btn-primary">Primary</button>
                                    <button type="button" class="btn btn-primary">Success</button>
                                    <button type="button" class="btn btn-primary">Warning</button>
                                    <button type="button" class="btn btn-primary">Danger</button>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="col-lg-6 col-md-6 col-sm-6 col-xs-12">
                        <div class="button-ad-wrap mg-tb-30">
                            <div class="alert-title">
                                <h2>Vertical Button Groups With Icon</h2>
                                <p>Bootstrap also supports vertical button groups.Use the class .btn-group-vertical to create a vertical button group.</p>
                            </div>
                            <div class="button-ap-list responsive-btn">
                                <div class="btn-group-vertical btn-custom-groups btn-custom-groups-one">
                                    <button type="button" class="btn btn-primary"><i class="fa fa-home adminpro-home-admin" aria-hidden="true"></i> Default</button>
                                    <button type="button" class="btn btn-primary"><i class="fa fa-info-circle adminpro-informatio" aria-hidden="true"></i> Primary</button>
                                    <button type="button" class="btn btn-primary"><i class="fa fa-check adminpro-checked-pro" aria-hidden="true"></i> Success</button>
                                    <button type="button" class="btn btn-primary"><i class="fa fa-exclamation-triangle adminpro-warning-danger" aria-hidden="true"></i> Warning</button>
                                    <button type="button" class="btn btn-primary"><i class="fa fa-times adminpro-danger-error" aria-hidden="true"></i> Danger</button>
                                </div>
                                <div class="btn-group-vertical btn-custom-groups">
                                    <button type="button" class="btn btn-primary"><i class="fa fa-home adminpro-home-admin" aria-hidden="true"></i> Default</button>
                                    <button type="button" class="btn btn-primary"><i class="fa fa-info-circle adminpro-informatio" aria-hidden="true"></i> Primary</button>
                                    <button type="button" class="btn btn-primary"><i class="fa fa-check adminpro-checked-pro" aria-hidden="true"></i> Success</button>
                                    <button type="button" class="btn btn-primary"><i class="fa fa-exclamation-triangle adminpro-warning-danger" aria-hidden="true"></i> Warning</button>
                                    <button type="button" class="btn btn-primary"><i class="fa fa-times adminpro-danger-error" aria-hidden="true"></i> Danger</button>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="row">
                    <div class="col-lg-6 col-md-6 col-sm-6 col-xs-12">
                        <div class="button-ad-wrap">
                            <div class="alert-title">
                                <h2>Standard Icon Button Group</h2>
                                <p>These are the different buttons group component</p>
                            </div>
                            <div class="button-ap-list responsive-btn">
                                <div class="btn-group btn-custom-groups btn-custom-groups-one">
                                    <button type="button" class="btn btn-primary"><i class="fa fa-user adminpro-avatar" aria-hidden="true"></i></button>
                                    <button type="button" class="btn btn-primary"><i class="fa fa-file-audio-o adminpro-back-restart" aria-hidden="true"></i></button>
                                    <button type="button" class="btn btn-primary"><i class="fa fa-cloud-download adminpro-check-icon" aria-hidden="true"></i></button>
                                    <button type="button" class="btn btn-primary"><i class="fa fa-rss adminpro-cloud-computing-down" aria-hidden="true"></i></button>
                                    <button type="button" class="btn btn-primary"><i class="fa fa-ticket adminpro-crop-tool" aria-hidden="true"></i></button>
                                </div>
                                <div class="btn-group btn-custom-groups">
                                    <button type="button" class="btn btn-primary"><i class="fa fa-area-chart adminpro-graph-round" aria-hidden="true"></i></button>
                                    <button type="button" class="btn btn-primary"><i class="fa fa-bar-chart adminpro-graph-down" aria-hidden="true"></i></button>
                                    <button type="button" class="btn btn-primary"><i class="fa fa-line-chart adminpro-bar-chart" aria-hidden="true"></i></button>
                                    <button type="button" class="btn btn-primary"><i class="fa fa-pie-chart adminpro-bar-chart-thr" aria-hidden="true"></i></button>
                                    <button type="button" class="btn btn-primary"><i class="fa fa-signal adminpro-analytics-arrow" aria-hidden="true"></i></button>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="col-lg-6 col-md-6 col-sm-6 col-xs-12">
                        <div class="button-ad-wrap res-mg-t-30">
                            <div class="alert-title">
                                <h2>Standard Icon Button Group</h2>
                                <p>These are the different buttons group component</p>
                            </div>
                            <div class="button-ap-list responsive-btn">
                                <div class="btn-group btn-custom-groups btn-custom-groups-one">
                                    <button type="button" class="btn btn-primary"><i class="fa fa-home adminpro-home-admin" aria-hidden="true"></i></button>
                                    <button type="button" class="btn btn-primary"><i class="fa fa-info-circle adminpro-informatio" aria-hidden="true"></i></button>
                                    <button type="button" class="btn btn-primary"><i class="fa fa-check adminpro-checked-pro" aria-hidden="true"></i></button>
                                    <button type="button" class="btn btn-primary"><i class="fa fa-exclamation-triangle adminpro-warning-danger" aria-hidden="true"></i>
										</button>
                                    <button type="button" class="btn btn-primary"><i class="fa fa-times adminpro-danger-error" aria-hidden="true"></i></button>
                                </div>
                                <div class="btn-group btn-custom-groups">
                                    <button type="button" class="btn btn-primary"><i class="fa fa-area-chart adminpro-graph-round" aria-hidden="true"></i></button>
                                    <button type="button" class="btn btn-primary"><i class="fa fa-bar-chart adminpro-graph-down" aria-hidden="true"></i></button>
                                    <button type="button" class="btn btn-primary"><i class="fa fa-line-chart adminpro-bar-chart" aria-hidden="true"></i></button>
                                    <button type="button" class="btn btn-primary"><i class="fa fa-pie-chart adminpro-bar-chart-thr" aria-hidden="true"></i></button>
                                    <button type="button" class="btn btn-primary"><i class="fa fa-signal adminpro-analytics-arrow" aria-hidden="true"></i></button>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="row">
                    <div class="col-lg-6 col-md-6 col-sm-6 col-xs-12">
                        <div class="button-ad-wrap mg-t-30">
                            <div class="alert-title">
                                <h2>Social Buttons</h2>
                                <p>These are the social buttons color styles</p>
                            </div>
                            <div class="button-ap-list responsive-btn">
                                <div class="button-style-four btn-mg-b-10">
                                    <button type="button" class="btn btn-custon-four btn-default"><i class="fa fa-facebook adminpro-facebook" aria-hidden="true"></i></button>
                                    <button type="button" class="btn btn-custon-four btn-default"><i class="fa fa-twitter adminpro-twitter" aria-hidden="true"></i></button>
                                    <button type="button" class="btn btn-custon-four btn-default"><i class="fa fa-google-plus adminpro-google-plus" aria-hidden="true"></i></button>
                                    <button type="button" class="btn btn-custon-four btn-default"><i class="fa fa-pinterest-p adminpro-pinterest" aria-hidden="true"></i></button>
                                    <button type="button" class="btn btn-custon-four btn-default"><i class="fa fa-linkedin adminpro-linkedin" aria-hidden="true"></i></button>
                                    <button type="button" class="btn btn-custon-four btn-default"><i class="fa fa-youtube" aria-hidden="true"></i>
										</button>
                                    <button type="button" class="btn btn-custon-four btn-default"><i class="fa fa-dropbox" aria-hidden="true"></i>
										</button>
                                    <button type="button" class="btn btn-custon-four btn-default"><i class="fa fa-digg" aria-hidden="true"></i>
										</button>
                                    <button type="button" class="btn btn-custon-four btn-default"><i class="fa fa-dribbble" aria-hidden="true"></i>
										</button>
                                    <button type="button" class="btn btn-custon-four btn-default"><i class="fa fa-edge" aria-hidden="true"></i>
										</button>
                                    <button type="button" class="btn btn-custon-four btn-default"><i class="fa fa-skype" aria-hidden="true"></i>
										</button>
                                </div>
                                <div class="button-style-four social-btn-icon-cl btn-mg-b-10">
                                    <button type="button" class="btn btn-custon-four btn-default"><i class="fa fa-facebook adminpro-facebook" aria-hidden="true"></i></button>
                                    <button type="button" class="btn btn-custon-four btn-default"><i class="fa fa-twitter adminpro-twitter" aria-hidden="true"></i></button>
                                    <button type="button" class="btn btn-custon-four btn-default"><i class="fa fa-google-plus adminpro-google-plus" aria-hidden="true"></i></button>
                                    <button type="button" class="btn btn-custon-four btn-default"><i class="fa fa-pinterest-p adminpro-pinterest" aria-hidden="true"></i></button>
                                    <button type="button" class="btn btn-custon-four btn-default"><i class="fa fa-linkedin adminpro-linkedin" aria-hidden="true"></i></button>
                                    <button type="button" class="btn btn-custon-four btn-default"><i class="fa fa-youtube" aria-hidden="true"></i></button>
                                    <button type="button" class="btn btn-custon-four btn-default"><i class="fa fa-dropbox" aria-hidden="true"></i>
										</button>
                                    <button type="button" class="btn btn-custon-four btn-default"><i class="fa fa-digg" aria-hidden="true"></i>
										</button>
                                    <button type="button" class="btn btn-custon-four btn-default"><i class="fa fa-dribbble" aria-hidden="true"></i>
										</button>
                                    <button type="button" class="btn btn-custon-four btn-default"><i class="fa fa-edge" aria-hidden="true"></i>
										</button>
                                    <button type="button" class="btn btn-custon-four btn-default"><i class="fa fa-skype" aria-hidden="true"></i>
										</button>
                                </div>
                                <div class="button-style-four social-btn-icon-cl-df">
                                    <button type="button" class="btn btn-custon-four btn-default"><i class="fa fa-facebook adminpro-facebook" aria-hidden="true"></i>
										</button>
                                    <button type="button" class="btn btn-custon-four btn-default"><i class="fa fa-twitter adminpro-twitter" aria-hidden="true"></i>
										</button>
                                    <button type="button" class="btn btn-custon-four btn-default"><i class="fa fa-google-plus adminpro-google-plus" aria-hidden="true"></i>
										</button>
                                    <button type="button" class="btn btn-custon-four btn-default"><i class="fa fa-pinterest-p adminpro-pinterest" aria-hidden="true"></i>
										</button>
                                    <button type="button" class="btn btn-custon-four btn-default"><i class="fa fa-linkedin adminpro-linkedin" aria-hidden="true"></i>
										</button>
                                    <button type="button" class="btn btn-custon-four btn-default"><i class="fa fa-youtube" aria-hidden="true"></i>
										</button>
                                    <button type="button" class="btn btn-custon-four btn-default"><i class="fa fa-dropbox" aria-hidden="true"></i>
										</button>
                                    <button type="button" class="btn btn-custon-four btn-default"><i class="fa fa-digg" aria-hidden="true"></i>
										</button>
                                    <button type="button" class="btn btn-custon-four btn-default"><i class="fa fa-dribbble" aria-hidden="true"></i>
										</button>
                                    <button type="button" class="btn btn-custon-four btn-default"><i class="fa fa-edge" aria-hidden="true"></i>
										</button>
                                    <button type="button" class="btn btn-custon-four btn-default"><i class="fa fa-skype" aria-hidden="true"></i>
										</button>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="col-lg-6 col-md-6 col-sm-6 col-xs-12">
                        <div class="button-ad-wrap mg-t-30">
                            <div class="alert-title">
                                <h2>Social Buttons</h2>
                                <p>These are the social buttons color styles</p>
                            </div>
                            <div class="button-ap-list responsive-btn">
                                <div class="button-style-four btn-mg-b-10">
                                    <button type="button" class="btn btn-custon-four btn-bg-cl-social btn-default"><i class="fa fa-facebook adminpro-facebook" aria-hidden="true"></i>
										</button>
                                    <button type="button" class="btn btn-custon-four btn-bg-cl-social btn-default"><i class="fa fa-twitter adminpro-twitter" aria-hidden="true"></i>
										</button>
                                    <button type="button" class="btn btn-custon-four btn-bg-cl-social btn-default"><i class="fa fa-google-plus adminpro-google-plus" aria-hidden="true"></i>
										</button>
                                    <button type="button" class="btn btn-custon-four btn-bg-cl-social btn-default"><i class="fa fa-pinterest-p adminpro-pinterest" aria-hidden="true"></i>
										</button>
                                    <button type="button" class="btn btn-custon-four btn-bg-cl-social btn-default"><i class="fa fa-linkedin adminpro-linkedin" aria-hidden="true"></i>
										</button>
                                    <button type="button" class="btn btn-custon-four btn-bg-cl-social btn-default"><i class="fa fa-youtube" aria-hidden="true"></i>
										</button>
                                    <button type="button" class="btn btn-custon-four btn-bg-cl-social btn-default"><i class="fa fa-dropbox" aria-hidden="true"></i>
										</button>
                                    <button type="button" class="btn btn-custon-four btn-bg-cl-social btn-default"><i class="fa fa-digg" aria-hidden="true"></i>
										</button>
                                    <button type="button" class="btn btn-custon-four btn-bg-cl-social btn-default"><i class="fa fa-dribbble" aria-hidden="true"></i>
										</button>
                                    <button type="button" class="btn btn-custon-four btn-bg-cl-social btn-default"><i class="fa fa-edge" aria-hidden="true"></i>
										</button>
                                    <button type="button" class="btn btn-custon-four btn-bg-cl-social btn-default"><i class="fa fa-skype" aria-hidden="true"></i>
										</button>
                                </div>
                                <div class="button-style-four social-btn-icon-cl btn-mg-b-10">
                                    <button type="button" class="btn btn-custon-four btn-bg-cl-facebook-tw btn-default"><i class="fa fa-facebook adminpro-facebook" aria-hidden="true"></i>
										</button>
                                    <button type="button" class="btn btn-custon-four btn-bg-cl-twitter-tw btn-default"><i class="fa fa-twitter adminpro-twitter" aria-hidden="true"></i>
										</button>
                                    <button type="button" class="btn btn-custon-four btn-bg-cl-google-tw btn-default"><i class="fa fa-google-plus adminpro-google-plus" aria-hidden="true"></i>
										</button>
                                    <button type="button" class="btn btn-custon-four btn-bg-cl-pinterest-tw btn-default"><i class="fa fa-pinterest-p adminpro-pinterest" aria-hidden="true"></i>
										</button>
                                    <button type="button" class="btn btn-custon-four btn-bg-cl-linkedin-tw btn-default"><i class="fa fa-linkedin adminpro-linkedin" aria-hidden="true"></i>
										</button>
                                    <button type="button" class="btn btn-custon-four btn-bg-cl-youtube-tw btn-default"><i class="fa fa-youtube" aria-hidden="true"></i>
										</button>
                                    <button type="button" class="btn btn-custon-four btn-bg-cl-dropbox-tw btn-default"><i class="fa fa-dropbox" aria-hidden="true"></i>
										</button>
                                    <button type="button" class="btn btn-custon-four btn-bg-cl-digg-tw btn-default"><i class="fa fa-digg" aria-hidden="true"></i>
										</button>
                                    <button type="button" class="btn btn-custon-four btn-bg-cl-dribbble-tw btn-default"><i class="fa fa-dribbble" aria-hidden="true"></i>
										</button>
                                    <button type="button" class="btn btn-custon-four btn-bg-cl-edge-tw btn-default"><i class="fa fa-edge" aria-hidden="true"></i>
										</button>
                                    <button type="button" class="btn btn-custon-four btn-bg-cl-skype-tw btn-default"><i class="fa fa-skype" aria-hidden="true"></i>
										</button>
                                </div>
                                <div class="button-ap-list">
                                    <div class="button-style-four">
                                        <div class="button-drop-style-one btn-default-bg">
                                            <button type="button" class="btn btn-custon-four btn-default">Like</button>
                                            <button class="btn-button-ct"><i class="fa fa-facebook"></i>
												</button>
                                        </div>
                                        <div class="button-drop-style-one">
                                            <button type="button" class="btn btn-custon-four btn-primary primary-btn-cl">Follow Me</button>
                                            <button class="btn-button-ct btn-button-primary-ct"><i class="fa fa-twitter"></i>
												</button>
                                        </div>
                                        <div class="button-drop-style-one btn-warning-bg">
                                            <button type="button" class="btn btn-custon-four btn-warning warning-btn-cl">Plus One</button>
                                            <button class="btn-button-ct btn-button-warning-ct"><i class="fa fa-google-plus"></i>
												</button>
                                        </div>
                                        <div class="button-drop-style-one btn-danger-bg">
                                            <button type="button" class="btn btn-custon-four btn-danger danger-btn-cl">Follower</button>
                                            <button class="btn-button-ct btn-button-danger-ct"><i class="fa fa-youtube"></i>
												</button>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <!-- Button End-->
        <div class="footer-copyright-area">
            <div class="container-fluid">
                <div class="row">
                    <div class="col-lg-12">
                        <div class="footer-copy-right">
                            <p>Copyright © 2018 Colorlib All rights reserved.More Templates <a href="#" target="_blank" title="tanjia">tanjia</a> - Collect from <a href="#" title="网页模板" target="_blank">网页模板</a></p>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <!-- jquery
		============================================ -->
    <script src="js/vendor/jquery-1.11.3.min.js"></script>
    <!-- bootstrap JS
		============================================ -->
    <script src="js/bootstrap.min.js"></script>
    <!-- wow JS
		============================================ -->
    <script src="js/wow.min.js"></script>
    <!-- price-slider JS
		============================================ -->
    <script src="js/jquery-price-slider.js"></script>
    <!-- meanmenu JS
		============================================ -->
    <script src="js/jquery.meanmenu.js"></script>
    <!-- owl.carousel JS
		============================================ -->
    <script src="js/owl.carousel.min.js"></script>
    <!-- sticky JS
		============================================ -->
    <script src="js/jquery.sticky.js"></script>
    <!-- scrollUp JS
		============================================ -->
    <script src="js/jquery.scrollUp.min.js"></script>
    <!-- mCustomScrollbar JS
		============================================ -->
    <script src="js/scrollbar/jquery.mCustomScrollbar.concat.min.js"></script>
    <script src="js/scrollbar/mCustomScrollbar-active.js"></script>
    <!-- metisMenu JS
		============================================ -->
    <script src="js/metisMenu/metisMenu.min.js"></script>
    <script src="js/metisMenu/metisMenu-active.js"></script>
    <!-- tab JS
		============================================ -->
    <script src="js/tab.js"></script>
    <!-- plugins JS
		============================================ -->
    <script src="js/plugins.js"></script>
    <!-- main JS
		============================================ -->
    <script src="js/main.js"></script>
</body>

</html>